2014-02-06 3 views
0

У меня есть дилемма Я хочу, чтобы пользователь заполнил форму, которая содержит информационное поле Owner, когда они нажмете следующую кнопку, они будут представлены с информацией Sales поле, которое имеет флажок Same as Owner Итак, когда пользователь нажимает этот флажок, значения в поле «Продажи» автоматически заполняются информацией из набора полей «Владелец». Я уверен, что это легко в jQuery, но я новичок в этом и не могу определить, как это делается. Ниже я включил свой код.Получение всех значений из определенного набора полей и установки в качестве значений в другом полевом наборе

продаж Информация:

<fieldset> 
    <legend>Sales Information</legend> 
     <p><label for="SalesFirstName">First Name</label> <input type="text" id="SalesFirstName" /></p> 
     <p><label for="SalesLastName">Last Name</label> <input type="text" id="SalesLastName" /></p> 
     <p><label for="SalesEmail">Email</label> <input type="text" id="SalesEmail" /><br /></p> 
     <p><label for="SalesPhone">Phone</label> <input type="text" id="SalesPhone" /></p> 
     <p><label for="SameAsOwner">Same as Owner</label><input id="SameAsOwner" name="SameAsOwner" type="checkbox" value="Yes"/></p> 

     <p class="navigation"><button class="button" type="button" onclick="prevForm('SalesInfo', 'OwnerInfo');">Previous</button>                        
         <button class="button" type="button" onclick="nextForm('SalesInfo', 'DetailedInfo');">Next</button></p> 
    </fieldset> 

<script> 
    $('#SameAsOwner').on('change', function(){ 
     if($(this).is(':checked')){ 
      alert('checked'); 
     } else { 
      alert('un-checked'); 
     } 
    }); 
</script> 

Владелец Информация:

<fieldset> 
    <legend>Owner Information</legend> 
     <p><label for="OwnerFirstName">First Name</label> <input type="text" id="OwnerFirstName" /></p> 
     <p><label for="OwnerLastName">Last Name</label> <input type="text" id="OwnerLastName" /></p> 
     <p><label for="OwnerEmail">Email</label> <input type="text" id="OwnerEmail" /><br /></p> 
     <p><label for="OwnerPhone">Phone</label> <input type="text" id="OwnerPhone" /></p> 


     <p class="navigation"><button class="button" type="button" onclick="prevForm('OwnerInfo', 'DealerInfo');">Previous</button>                        
         <button class="button" type="button" onclick="nextForm('OwnerInfo', 'SalesInfo');">Next</button></p> 
    </fieldset> 

Они все перечислены в отдельных дивы кнопки next and prev просто скрывать и показывать дивы, которые содержат Fieldset. У меня есть флажок on функция изменения, но теперь мне нужно захватить данные только с полей Owner и установить их в качестве значений полей Sales.

UPDATE: Я получил код, работающий по назначению, мне интересно, есть ли способ немного почистить его.

$('#SameAsOwner').on('change', function(){ 
     if($(this).is(':checked')){ 
      var Blank = ""; 
      var FirstName = $('#OwnerFirstName').val(); 
      var LastName = $('#OwnerLastName').val(); 
      var Phone = $('#OwnerPhone').val(); 
      var Email = $('#OwnerEmail').val(); 
      $("#SalesFirstName").val(FirstName); 
      $("#SalesLastName").val(LastName); 
      $("#SalesEmail").val(Email); 
      $("#SalesPhone").val(Phone); 
     } else { 
      $("#SalesFirstName").val(Blank); 
      $("#SalesLastName").val(Blank); 
      $("#SalesEmail").val(Blank); 
      $("#SalesPhone").val(Blank); 
     } 
    }); 

ответ

1

Вы можете очистить его в том смысле, не использующих переменных, просто $("#SalesFirstName").val($('#OwnerFirstName').val());

Другой метод заключается в определении массива/объекта полей, которые соответствуют и затем только петлю через них.

Если вы хотите, чтобы поля формы сами определяли, какое поле они заполняют, вы можете использовать атрибуты data- и прочитать это в jquery.

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