Получение значений динамически генерируемых текстовых полей и проверка всех текстовых полей при отправке с помощью jQuery

Мне нужна помощь в получении значений динамически генерируемых текстовых полей. Хотя я нашел решения, но, похоже, я не могу следовать за ним.Получение значений динамически генерируемых текстовых полей и проверка всех текстовых полей при отправке с помощью jQuery

Что я пытаюсь достичь: 1.Создать текстовое поле с помощью кнопки «Добавить». 2. Удалить текстовое поле с кнопкой «Удалить». 3. Извлечь введенные значения в текстовые поля. 4.Введите значения в текстовые поля Нет двух текстовых полей, которые должны содержать одинаковые значения (даже в верхнем/нижнем регистре).

Я застрял в 3 и 4-го требования.

Ниже мой код, что я пытаюсь.

 <!doctype html> 
    <html> 
    <head> 
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script> 
    <script type="text/javascript"> 

     var counter=0; 

     $(document).ready(function(){ 
     $(".addCF").click(function(){ 
      $("#customFields").append('<tr valign="top"><th scope="row"><label for="customFieldName">Custom DB</label></th><td><input type="text" class="code" id="customFieldValue' + counter + '" name="customFieldValue[]" value="" placeholder="Input Value" /> &nbsp; <input type="button" name="remCFName" class="remCF" value="Remove"></td></tr>'); 

      counter++; 

      alert("Value " +counter); 
     }); 


     $("#customFields").on('click','.remCF',function(){ 
      $(this).parent().parent().remove(); 

      counter--; 
      alert("Value_New " +counter); 
     }); 

     $(".getButtonValue").click(function() { 
     var msg =''; 
     for(i=0; i<=counter; i++){ 
      msg += "\n customFieldValue #" + i + " : " + $('#customFieldValue' + i).val(); 
     } 
      alert(msg); 
     }); 

    }); 
    </script> 
    </head> 
    <body> 
     <table class="form-table" id="customFields"> 
     <tr valign="top"> 
      <th scope="row"><label for="customFieldName">Custom DB</label></th> 
      <td> 
       <input type="text" class="code" id="customFieldValue" name="customFieldValue[]" value="" placeholder="Input Value" /> &nbsp; 

       <input type="button" name="addCFName" class="addCF" value="Add"> 
      </td> 

     <td> 
      <input type="button" name="getValue" class="getButtonValue" value="Get Value"> 
     </td> 

     </tr> 
    </table> 
    </body> 
    </html>

Может ли кто-нибудь помочь мне в этом.

Сообщите мне, если я не могу объяснить свою проблему.

Благодаря

источник

2014-01-08 bina001

Используйте 'each()': http://api.jquery.com/jquery.each/ –

Вот ваш рабочий код

первый текстовый блок не ввязываясь в цикле из-за различного ид ..

http://jsfiddle.net/xvRpv/

$(".getButtonValue").click(function() { 
    var msg =''; 
    for(i=0; i<=counter-1; i++){ 
     msg += "\n customFieldValue #" + i + " : " + $('#customFieldValue'+i).val(); 
    } 
     //alert($('#customFieldValue1').val()); 
     alert(msg); 
    });

источник

2014-01-08 12:48:52

самый добро пожаловать .. –

Привет, я столкнулся с одной проблемой ..когда я пытаюсь получить значение после удаления строк/строк, тогда я не получаю правильные значения. Не могли бы вы помочь в этом – bina001

, но в скрипке его рабочий тон после удаления текстового поля. –

Что-то, как это должно работать:

$(".getButtonValue").click(function() { 
    $("input[type=text]").each(function(){ 
    console.log("Input box" + i + " contains " + this.value); 

    // Validation here 
    }); 
});

EDIT:

С проверкой:

$(".getButtonValue").click(function() { 
    var textboxValues = []; 

    $("input[type=text]").each(function(i){ 
    var fieldVal = (this.value === "")? "blank" : this.value; 
    console.log("Field " + i + " contains " + fieldVal) 

    if(fieldVal !== "blank"){ 
     textboxValues.push(this.value.toLowerCase()); 

     if ($.inArray(fieldVal, textboxValues) != -1){ 
     alert("Field " + i + " contains a duplicate value!"); 
     } 
    } 
    }); 
});

источник

2014-01-08 12:35:03

Большое спасибо за помощь. Я пытаюсь выполнить проверку. – bina001

Я отредактировал мое сообщение, чтобы добавить подтверждение. Разве это не работает? –

Извините. Я не могу включить изменения в свой код. Я пытаюсь ... дам вам знать в ближайшее время. Спасибо за помощь в этом. – bina001

Попробуйте mate.Hope у может получить некоторое представление об этом :)

$('.code').each(function(){ 
     var $this = $(this); 
     //console.log($(this).val()); //Gets you each fields value 
     $('.code').not($this).each(function(){ 
       if ($(this).val()==$this.val()) {duplicate=true;} 
     }); 
}); 

if(duplicate) { 
    alert('entries are similar'); 
    }else{ 
    alert('all entries different') 
    }

Я сделал скрипку

http://jsfiddle.net/82qC8/

источник

2014-01-08 12:50:52 Outlooker

Большое спасибо ... Это работает. Я пытаюсь изменить его, чтобы я мог проверить текст, чувствительный к регистру, и .. – bina001

Получение значений динамически генерируемых текстовых полей и проверка всех текстовых полей при отправке с помощью jQuery

ответ

Смежные вопросы