HEEN
HEEN

Reputation: 4727

jQuery button click function is not working as expected

I want to show div on button click. SO for that I have written code like below

<asp:Button ID="btnDownloadExcelTemp" runat="server" CssClass="btn btn-blue" Text="Download Template" OnClick="btnDownloadExcelTemp_Click" OnClientClick="return showHideUploadDiv();" />

Div which I want to enable

<div class="col-md-9" id="dvUploadFile" style="display: none;">
  <div class="form-group">
    Upload file
    <div class="row clearfix">
      <div class="col-md-8">

        <asp:FileUpload ID="fluploadData" CssClass="form-control" runat="server" />
      </div>
      <div class="col-md-4">

        <asp:Button ID="btnUploadExcelData" CssClass="btn btn-blue" runat="server" Text="Upload" OnClick="btnUploadExcelData_Click" />
      </div>
    </div>

  </div>
</div>

But while calling the function which is below, the div is not getting showed.

function showHideUploadDiv() {            
  alert('1');
  $("#MainContent_btnDownloadExcelTemp").click(function () {
    $('#dvUploadFile').show();
  });
}

Note: The alert is firing but it is not getting inside the function. Please suggest why it's happening like this.

Upvotes: 0

Views: 132

Answers (1)

Magnus Ingwersen
Magnus Ingwersen

Reputation: 411

Try removing the code adding your .click function, so it is like this?:

function showHideUploadDiv() {            
    alert('1');
    $('#dvUploadFile').css("display", "block");
}

You do not need to assign an onclick to the button inside your function as your function is already assigned to the button in this line:

<asp:Button ID="btnDownloadExcelTemp" runat="server" CssClass="btn btn-blue" Text="Download Template" OnClick="btnDownloadExcelTemp_Click" OnClientClick="return showHideUploadDiv();" />

// "OnClientClick="return showHideUploadDiv();"

Upvotes: 2

Related Questions