Question

I have a div which has display:none. On button press I want to show it using jquery. It is shown but just in a second or two it is automatically hidden.

I am not an expert and not able to get where I am doing wrong. Please help me.

  <asp:Button runat="server" ID="btnCVUpload" Text="Upload" OnClientClick="CVConfirm()" />  <div id="divConfirmCV" style="border: dashed 2px black; background: gray; display:none;">
                A profile can have only one CV, uploading this CV will remove an existing CV. Click
                "Yes" to proceed
                <asp:Button runat="server" ID="btnCVYes" Text="Yes" />
                <asp:Button runat="server" ID="btnCVNo" OnClientClick="HideCVConfirm" Text="NO" />
            </div>




 function CVConfirm() {
            $("#divConfirmCV").css("display","block").show(1000)
        }

Answer 1

It’s hidden again because the page is posting back to the server, and you’ve got a brand new page again with the initial state of the button being hidden. You either want to a) not show the div until the page posts back, in which case you could make the div an asp:panel or something similar and set it to Visible on your button click. Or b) you don’t want to use an asp:Button, but a regular <input type=button> which would NOT post back to the server, if you just want to show the div without hitting the server again. I’d say by the look of your code you really want to go with option b. So, your code would simply be:

<input type=button ID="btnCVUpload" value="Upload" onclick="CVConfirm()" />

Of course, your’re using jquery so you should really do:

<input type=button ID="btnCVUpload" value="Upload" />

<script>
  $(function(){
    $("#btnCVUpload").click(function(){
       $("#divConfirmCV").css("display","block").show(1000);
    });
  });
</script>