2017-10-13 1 views
0

je le code suivant pour dupliquer l'adresse de facturation est entré dans le formulaire d'adresse de livraison:copie l'adresse de livraison à l'adresse de facturation en utilisant mvc

Lorsque je clique sur la case à cocher la valeur ne passe pas à la zone de texte Adresse temporaire

<form id="form" action=""> 
          <section> 
           <div id="row"> 


            <h5 class="with-border">Permanent Address </h5> 
            <div class="row"> 
             <div class="col-lg-4"> 
              <fieldset class="form-group"> 
               <label class="form-label semibold control-label">Address line 1</label> 
               @Html.TextBoxFor(model => model.pharmaCompanyDivision.PAddress1, new { @class = "form-control", @id = "txtPAddress1", placeholder = "Address Line1" }) 
              </fieldset> 
             </div> 
             <div class="col-lg-4"> 
              <fieldset class="form-group"> 
               <label class="form-label semibold control-label">Address Line2</label> 
               @Html.TextBoxFor(model => model.pharmaCompanyDivision.PAddress2, new { @class = "form-control", @id = "txtPAddress2", placeholder = "Address Line2" }) 
              </fieldset> 

            </div><!--.row--> 




            <div class="checkbox"> 
             <input type="checkbox" id="check-1"> 
             <label for="check-1">Billing Address is same as Shipping Address.</label> 
            </div> 

            <h5 class="with-border">Temporary Address </h5> 
            <div class="row"> 
             <div class="col-lg-4"> 
              <fieldset class="form-group"> 
               <label class="form-label semibold control-label">Address line 1</label> 
               @Html.TextBoxFor(model => model.pharmaCompanyDivision.TAddress1, new { @class = "form-control", @id = "txtTAddress1", placeholder = "Address Line1" }) 
              </fieldset> 
             </div> 
             <div class="col-lg-4"> 
              <fieldset class="form-group"> 
               <label class="form-label semibold control-label">Address Line2</label> 
               @Html.TextBoxFor(model => model.pharmaCompanyDivision.TAddress2, new { @class = "form-control", @id = "txtTAddress2", placeholder = "Address Line2" }) 
              </fieldset> 
             </div> 

            </div><!--.row--> 

          </section> 
         </form> 

Scripts:

<script type="text/javascript" language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('input:checkbox[id*=check-1]').change(function() { 
      if ($(this).is(':checked')) { 
       $('input:text[id*=txtTAddress1]').val($('input:text[id*=txtPAddress1]').val()); 
       $('input:text[id*=txtTAddress2]').val($('input:text[id*=txtPAddress2]').val()); 
      } 
      else { 
       $('input:text[id*=txtTAddress1]').val(''); 
       $('input:text[id*=txtTAddress2]').val(''); 
      } 
     }); 
    }); 


</script> 

First Image Première case d'image cochée true, la valeur non Transmis à la tex TBOX

Empty ## Heading ##

J'apprécie vraiment toute aide.

+0

Votre code travaille pour moi –

+0

@ CarstenLøvboAndersen dans mon côté ne fonctionne pas vide zone de texte seulement –

+0

Je ne peux pas vous dire pourquoi c'est, mais il doit avoir quelque chose à voir avec le html autogénéré de mvc. montrez-nous le html autogenerated –

Répondre

0

J'ai testé cela en utilisant une version simplifiée et cela fonctionne donc je suppose que quelque chose dans votre environnement est en cours d'exécution. Peut-être que le HTML pour les entrées n'est pas rendu tel que prévu. , ou peut-être un autre JS supprime ces entrées du DOM et les remplace. Si cela se produit alors la jquery fonctionnera avec un élément qui n'existe plus sur le DOM. Cela peut se produire avec DOM rendu des travaux de cadre JavaScript tels que angulaire, réagissez, Vue et ainsi de suite ... J'espère que cela aide

Voici ma version simplifiée utilisée pour les tests:

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 
<div> 
 
\t <lable for="txtPAddress1">Address 1</lable> 
 
\t <input id="txtPAddress1" type="text"> 
 
</div> 
 

 
<input id="check-1" type="checkbox"> 
 

 
<div> 
 
\t <lable for="txtTAddress1">Address 1</lable> 
 
\t <input id="txtTAddress1" type="text"> 
 
</div> 
 

 
<script type="text/javascript" language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
 
<script type="text/javascript"> 
 
    $(document).ready(function() { 
 
     $('input:checkbox[id*=check-1]').change(function() { 
 
      if ($(this).is(':checked')) { 
 
       $('input:text[id*=txtTAddress1]').val($('input:text[id*=txtPAddress1]').val()); 
 
       $('input:text[id*=txtTAddress2]').val($('input:text[id*=txtPAddress2]').val()); 
 
      } 
 
      else { 
 
       $('input:text[id*=txtTAddress1]').val(''); 
 
       $('input:text[id*=txtTAddress2]').val(''); 
 
      } 
 
     }); 
 
    }); 
 
</script> 
 
</body> 
 
</html>

+0

si j'utilise la valeur passée à la zone de texte ... si j'utilise @ Html.TextBoxFor (model =>) la valeur non passée à la zone de texte @Merb –