How to prevent postback to asp button when displaying popup using jQuery

Question

I have the following ItemTemplate in my GridView:

 <ItemTemplate> <asp:Button UseSubmitBehavior="false" runat="server" ID="btnShow" CssClass="btnSearch" Text="View All" CommandName="ViewAll" OnClientClick="myfunction(); return false;" OnCommand="btnShow_Command" CommandArgument='<%#((GridViewRow)Container).RowIndex%>' /> </ItemTemplate> 

For ItemTemplate , I have a button that opens a popup when clicked using the following jQuery:

 $(document).ready(function () { $(".btnSearch").click(function (e) { e.preventDefault(); //centering with css centerPopup(); //load popup loadPopup(); }); }); function myfunction() { } 

my Command code-behind:

 protected void btnShow_Command(object sender, CommandEventArgs e) { int index = 0; if (e.CommandName == "ViewAll") { index = Convert.ToInt32(e.CommandArgument); DataTable cacheTable = HttpContext.Current.Cache["ResultsTable"] as DataTable; string column = cacheTable.Rows[index].Field<string>("Guideline"); string test = BookingResults.Rows[index].Cells[7].Text; string html = HttpUtility.HtmlDecode(column); ResultsDiv.InnerHtml = html; //tbGL.Text = html; //upData.Update(); //MessageBox.Show(index.ToString()); } } 

I added OnClientClick="myfunction(); return false;" because he did the postback every time I clicked. If I have several lines, this only works on the first click, but at any time after that, the pop-up window does not appear when you press another or the same button.

How to allow it so that no matter which button is pressed, a pop-up window is displayed without postback?

Answer 1

In fact, you did not find the implementation of your myfunction () method, if the myfunction () method has a syntax error, then OnClientClick will be invalid and it will send back / submit the form to the server.

Try removing the call from OnClientClick and just implement your logic in jquery on the click event using the class selector as shown below.

 $(document).ready(function () { $(".btnSearch").click(function (e) { e.preventDefault(); alert($(this).val() + " Clicked"); // you can put your method mymethod() here // you can put youe popup logic here return false; }); }); 

You can also see this js fiddle example

Answer 2

Put it in the tag or tag <%: Html.BeginForm%>

Answer 3

 OnClientClick="return myfunction(); function myfunction(){ // you can put youe popup logic here return false; } 

Using this button, your button will never send messages back.