0

Генерируемая форма. Количество пунктов неизвестно. Поэтому name задал при помощи []. После проверки формы приходит JSON объект, в котором хранятся ошибки

errors:
    name.0: ["Поле name.0 обязательно для заполнения."],
    test.0: ["Поле test.0 обязательно для заполнения."]

Как, при помощи jQuery, выбрать input с ошибкой?

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="text" name="test[]" value="">
  <input type="text" name="test[]" value="">
  <input type="text" name="test[]" value="">
  <input type="text" name="test[]" value="">
  <input type="text" name="name[]" value="">
  <input type="text" name="name[]" value="">
  <input type="text" name="name[]" value="">
</form>

3
  • 1
    А где пример JSON? 19 дек 2019 в 16:13
  • Добавил фрагмент Json, в таком виде он у меня отображается в console.log
    – Gagablik
    19 дек 2019 в 16:17
  • 1
    То что вы добавили в вопрос, это не JSON. 20 дек 2019 в 5:47

3 ответа 3

3

мб так

let json = {"name.0": ["Поле name.0 обязательно для заполнения."], 
      "test.0": ["Поле test.0 обязательно для заполнения."]};

for(let item of Object.keys(json)) {
  let [,name, index] = item.match(/(.*)\.(\d+)/); 
  console.log( $(`input[name='${name}[]']`)[index] );
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="text" name="test[]" value="1">
  <input type="text" name="test[]" value="2">
  <input type="text" name="test[]" value="3">
  <input type="text" name="test[]" value="4">
  <input type="text" name="name[]" value="5">
  <input type="text" name="name[]" value="6">
  <input type="text" name="name[]" value="7">
</form>

0
2

let responseJson = '{ "errors": { "name.0": ["Поле name.0 обязательно для заполнения."], "test.0": ["Поле test.0 обязательно для заполнения."] } }'; 
const parsed = JSON.parse(responseJson); 

const elems = []; 
Object.keys(parsed.errors || {}).forEach(
  e => e.replace(/^([^.]+)\.([^.]+)$/, 
    (m, p1, p2) => elems.push($(`input[name="${p1}[]"]`).get(+p2)) 
  )
); 
$(elems).css('border-color', 'red'); 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="text" name="test[]" value="">
  <input type="text" name="test[]" value="">
  <input type="text" name="test[]" value="">
  <input type="text" name="test[]" value="">
  <input type="text" name="name[]" value="">
  <input type="text" name="name[]" value="">
  <input type="text" name="name[]" value="">
</form>

0

Подключаемся к форме, а потом ищем необходимые нам input. C помощью метода eq - выбираем нужный

let $form = $('form').find('input[name="name[]"]');
console.log(form.eq(3)) // Получите 4 элемент 
1
  • Но я не могу знать в каком пункте будет ошибка и как следствие я заранее не знаю, какой элемент мне понадобится. У меня в Json есть ключ с названием "test.3" (к примеру)
    – Gagablik
    19 дек 2019 в 16:14

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.