jeudi 18 février 2016

How to clear the textfield using checking the checkbox [duplicate]

This question already has an answer here:

In my code, when i click the checkbox it disabled the textfield. but my problem is when the user typed first in the textfield and he/she check the checkbox, the value that the user inputted in the textfield is still there but its already disabled. I wanted to clear the textfield and disabled it when the checkbox is clicked. Here's my code

<div class="checkbox">
                    <label>
                    <input type="checkbox" id="checkbox">Same as Current Address.
                    </label>    
                 </div>
                 <div id="everything">
                    <div class="col-sm-5">
                    </div>
                    <div rv-each-address="applicant:personal_information:addresses">
                       <div class="row">
                          <div class="col-md-8">
                             <div class="form-group">
                                <label class="control-label"><strong  rv-text="address:description">Permanent Address</strong></label>
                                <input class="form-control" rv-value="address:address" id="permanentAddress"
                                   name="model.cid" data-validate="required" />
                             </div>
                          </div>
                          <div class="col-md-4">
                             <div class="form-group">
                                <label class="control-label" for="city">City</label> <input
                                   rv-value="address:city" rv-enabled="address:province" type="text" class="form-control typeahead" name="city"
                                   id="city" data-validate="required"
                                   placeholder="Current city" />
                             </div>
                          </div>
                       </div>
                       <div class="row">
                          <div class="col-md-4">
                             <div class="form-group">
                                <label class="control-label" for="state">Province</label> <input
                                   rv-value="address:province" rv-enabled="address:country" type="text" id="province" placeholder="Select Province"
                                   name="province" class="form-control typeahead">
                             </div>
                          </div>
                          <div class="col-md-4">
                             <div class="form-group">
                                <label class="control-label" for="country">Country</label> 
                                <select name="gender" class="form-control" id="country">
                                   <option value="" disabled selected>Country</option>
                                   <option>Philippines</option>
                                   <option>Hong Kong</option>
                                   <option>South Korea</option>
                                   <option>Singapore</option>
                                   <option>China</option>
                                </select>
                             </div>
                          </div>
                          <div class="col-md-4">
                             <div class="form-group">
                                <label class="control-label" for="postalCode">Postal
                                Code</label> <input class="form-control" rv-value="address:postalCode" name="postalCode"
                                   id="postalCode" data-validate="required"
                                   placeholder="Zip Code" />
                             </div>
                          </div>
                       </div>
                    </div>
                 </div>
                 <script>
                    jQuery(document).ready(function($) {
                     $('#checkbox').change(function(){
                            var div = $('#everything');
                          if (div.attr('class')!="disabled") {
                              div.addClass("disabled");
                              $("#everything *").attr("disabled", true);
                          }
                          else {
                            div.removeClass("disabled");
                            $('#everything *').attr('disabled',false);
                          }
                        });

                            $("#checkbox").change(function() {
                                if ($(this).not(":checked")) {
                                    $('#postalCode,#city,#province').val("");
                                } 
                            });
                    });
                 </script> 




Aucun commentaire:

Enregistrer un commentaire