CODEWITHSUNDEEP
jquery
vishnu
vishnu

Reputation: 4599

activate the button when trigger the event using jquery

I am doing jQuery form validations for blank fields. If any field is blank, i am able to disabling the submit button.

html

    <div class="row popular">
       <div data-val="AXIS"><img src="images/axisbank.gif">
        </div>
       <div data-val="HDFC"><img src="images/hdfcbank.gif">
       </div>
    </div>

   <input name="" type="text" id="banknametxt" placeholder="Select Bank Name">
   <div class="row center bankbt">
      <a href="javascript:" class="bt btblue netBankPay disableClick" id="submitBtn">
      <img src="images/icon_pay.png"> Pay</a>
   </div>

If i click on the radio button, i am able to setting the value in the textbox But the button is still disable.(i.e, need to enable the button)

jquery

  $(function() {
    activatePayButton('submitBtn'); 
    $(".popular div").click(function() {
         var nameAttr = $(this).attr('data-val');
          $("#banknametxt").val(nameAttr);
      });

    function activatePayButton(formId){
        $form = $('#'+formId);     
        $form.find(':input').on('change keyup blur', function(event) {                                     
        var disable = false;   
        $form.find("input[type!='hidden']").each(function(i, el) {
           if ($.trim(el.value) === '') {
              disable = true; 
           }
        });
        if(disable == true){    
          $form.find('#submitBtn').addClass('disableClick');
         } else{
          $form.find('#submitBtn').removeClass('disableClick');
         }
      });
    }
    });

Upvotes: 0

Views: 45

Answers (2)

Manwal
Manwal

Reputation: 23816

After changing value with $("#banknametxt").val(nameAttr); will not invoke $form.find(':input').on('change keyup blur' event.

If you want to do so after changing value from jquery use this

$("#banknametxt").val(nameAttr);
$("#banknametxt").trigger('change');//manually triggering event

Upvotes: 1

rrk
rrk

Reputation: 15846

Add click binding to the button with disableClick class.

$(document).on('click','a.disableClick',function(event){
    event.preventDefault();
    event.stopImmediatePropagation();
}

Upvotes: 0

Related Questions