mercredi 20 janvier 2016

Unable to show/hide button on checkbox check in jQuery

I'm using ASP.NET checkbox controls. And what I'm trying to do is to simply change visibility of button on checkbox change event. If checkbox is checked then hide button, else if it is unchecked show the button.

I have 2 problems with my jQuery code.

  1. On initial change event does not get triggered. I've putted break point on jQuery code and function doesn't get invoked. On second change it gets invoked regularly.

  2. When button shows it is visible only for less then second, and then goes back to hidden, even thou it showed be visible until next change.

This is my ASP.NET code:

<asp:UpdatePanel UpdateMode="Conditional" ID="upDirectDebitPanel" runat="server" EnableViewState="True">
    <ContentTemplate>
        <div runat="server" id="divSameAsMerchant" visible="False">
            <asp:CheckBox runat="server" ID="chkSameAsMerchantBank" AutoPostBack="True" Checked="True" OnCheckedChanged="chkSameAsMerchantBank_CheckedChanged" />
            <asp:Label runat="server" AssociatedControlID="chkSameAsMerchantBank" ID="lblSameAsMerchantBank" meta:resourcekey="lblSameAsMerchantBank"></asp:Label>
            <asp:Button runat="server" ID="btnShowBankInformationModal" meta:resourcekey="btnShowBankInformationModal" CausesValidation="False" style="visibility: hidden"/>
        </div>
    </ContentTemplate>
</asp:UpdatePanel> 

And this is jQuery code:

var sameAsMerchantBank = $('#<%=chkSameAsMerchantBank.ClientID%>');
var btnShowBankInformationModal = $('#<%=btnShowBankInformationModal.ClientID%>');

$(sameAsMerchantBank).change(function () {
     if ($(this).is(":checked")) {
           $(btnShowBankInformationModal).css("visibility", "hidden");
     }
     $(btnShowBankInformationModal).css("visibility", "visible");
});

Anybody knows what I am doing wrongly?

Aucun commentaire:

Enregistrer un commentaire