Cómo conservar una vista parcial inyectada después de la actualización de la página en asp.net mvc

Estoy usando ASP.NET MVC 4 y jQuery . Tengo un botón de control en mi vista. Cuando se hace clic en él, “inyecta” una vista parcial en mi vista. Cuando actualizo la página, la vista parcial desaparece.

Mi marca HTML:

  

Some text.

Mi jQuery para devolver la vista parcial con una llamada AJAX para devolver el HTML:

 $('#RetrieveButton').click(function () { $.ajax( { type: 'POST', url: '@Url.Action("GetRuleDetails")', data: { systemCode: $('#SystemCodes').val() }, dataType: "html", success: function (result) { alert('success'); var domElement = $(result); $("#RuleDetails").html(domElement); }, error: function (result) { alert('error'); } }); }); 

Mi método de acción:

 public ActionResult GetRuleDetails() { RuleViewModel viewModel = new RuleViewModel(); return PartialView("_RuleInformation", viewModel); } 

Mi vista parcial:

 @model MyProject.ViewModels.Rules.RuleViewModel 

Rule Details

Necesito esta vista parcial “inyectada” para permanecer allí si tuviera que actualizar la página. Actualmente se “reinicia” si tuviera que actualizarlo, y el parcial que se inyectó se ha ido.

No volverá a mostrar esa vista parcial, ya que no recuerda el estado del botón pulsado.

Una de las formas de lograr lo que está buscando es mediante el uso de sammy.js

Al hacer clic en el botón, puede configurar el hashurl usando sammy.js (por ejemplo: '#/partialview' ) y en la página de actualización del hashurl la parte permanece intacta (pero no va al servidor). Y luego puede manipular el código de cliente en consecuencia

  1. Tome la referencia sammy.js en su página.
  2. Intialize sammy como abajo

      var app = $.sammy('body', function (context){ this.get('#/PartialView1', function () { fnLoadPartialView(); }); }); 
  3. cambiar Recuperar con href = ‘PartialView1’

  4.  function fnLoadPartialView (){ $.ajax( { type: 'POST', url: '@Url.Action("GetRuleDetails")', data: { systemCode: $('#SystemCodes').val() }, dataType: "html", success: function (result) { alert('success'); var domElement = $(result); $("#RuleDetails").html(domElement); }, error: function (result) { alert('error'); } }); } 

5.

 $('#RetrieveButton').click(function () { fnLoadPartialView (); });