mvc2 with ajax table enabling back button

Question

I have created my application that has search form and below contains results for the search. Now i want to be able to add history, button back functionality.

The problem is i am caught in infinitive loop of loading page and i am not sure why, this is in FireFox.

I have followed this tutorial how to do this:

http://www.asp.net/mvc/tutorials/contact-manager/iteration-7-add-ajax-functionality-cs

My code is:

Javascript

 <% =Html.JQuery() %>
 <script src="../../../../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
 <script src="../../../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
    <script type="text/javascript">

    var _currentCaseId = -1;
    Sys.Application.add_init(pageInit);
        function OnBegin() {
            var caseId =  $("#SelectDeceased_hidden").val();

            Sys.Application.addHistoryPoint({ "caseId": caseId });

            $(document).ready(function () {
                $("#divTableContainer").html("");
            });
        }

        function OnSuccess() {
            $('#divTableContainer').fadeIn('slow');
        }

        function OnFailure() {
            alert("Something went wrong. Try again...");
        }

    function pageInit() {
        // Enable history
        Sys.Application.set_enableHistory(true);

        // Add Handler for history
        Sys.Application.add_navigate(navigate);
    }

    function navigate(sender, e) {
        // Get groupId from address bar
        var caseId = e.get_state().caseId;

        // if cases does not match
        if (_currentCaseId != caseId) {
            // assign the case id
            _currentCaseId = caseId;
            alert(caseId);
            $(document).ready(function () {

                $.ajax({
                    url: "/PostItems/UmiTable?currentCase=" 
                                             + _currentCaseId 
                                             + "&EntityType=-1",
                    success: function (data) {
                        $("#divContactList").text(data);
                    }
                });
            });
        }
    }

And my html

  <% using (Ajax.BeginForm("UmiTable", new AjaxOptions() { 
                                       OnFailure = "OnFailure", 
                                       OnBegin = "OnBegin", 
                                       LoadingElementId = "divLoading", 
                                       UpdateTargetId = "divTableContainer" })) %>
  <% { %>
  <% using (Html.MooseFieldWrapper("Find case", "StandardForm"))
       {  %>             
            <%= Html.CutomTextBox("Case") %>                
           <li class="Button"><input type="submit" value="Go" /></li>
    <% } %>
  <% } %>
 <div id="divLoading">     
     <div><img src="Indicator.gif" alt="loading data" />Loading</div>
 </div>
 <div id="divTableContainer"></div>

Answer 1

in the end i have used jquery history script to manage navigation.