'UI changes not persisting in ASP.Net application

I have a table that's hidden by default. When clicking the search button, I'm using jQuery to remove the d-none class and show the table.

<input type="submit" value="Search" class="btn btn-default" id="searchName" />
<table id="resultsTable" class="table d-none">

$(document).ready(function() {
  $("#searchName").click(function () {
      $("#resultsTable").removeClass("d-none");
  });
});

It works, but only for a brief moment then the table disappears again. I think that has to do with persistence but unsure how to progress.

Can anyone point me in the right direction please?

jqueryhtmlcssasp.net.net


Solution 1:[1]

On submit the page refresh thus the original view of the page is opened. To avoid this try using IsPostBack to false which is available in asp.net. this would not refresh the page but will do the work. Other way to hide the page on load and using JQuery you can show the table or the div on button click once again with IsPostBack back to be false.

Solution 2:[2]

When clicking a type="submit" button the default behavior is to send the form to the server and refresh the page, so the javascript runs, and right after, the page is hit with a refresh, and the browser recieves the server answer, which might be the page again.

I haven't used ASP.Net in a while but if that button doesn't need to send anything to the server, you can just remove the type="submit" and change it to type="button".

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Parth Kinjal Shah
Solution 2

Related Questions