MVC RedirectToAction not rendering updated html in View

Question

Here's an overview; I have a view with a table of data and upon changing the filter options (checkboxes) I call a filter action, do some work, then redirecttoAction to the main action which accepts my filter info. Stepping through in debug I can see the expected data passed through the actions and even on the View with the building of the html, however the html expected with more or fewer rows does not render - it stays the same as the defaulted filtered list.

Here is some of the code.

HTML with checkboxes:

<fieldset>
<legend style="color: #27568e;">Filter</legend>
    <table id="Filter">
        <thead>
        </thead>
        <tbody>
            <tr>
                <td>
                <input type="checkbox"  value="14" name="filterList" checked="checked"/>Type1
                <input type="checkbox"  value="15"name="filterList" checked="checked"/>Type2
                <input type="checkbox"  value="16" name="filterList" />Type3
                <input type="checkbox"  value="17"  name="filterList" />Type4
                <input type="button" value="Filter" id="Filterbutton" onclick="getFilterList('<%= Model.myId %>','filterList');" />
                </td>
            </tr>
        </tbody>
    </table>
 </fieldset>

Javascript/JQuery

<script type="text/javascript">

function getFilterList(id, checklist) 
   {
       var data = {};
       var resultString = new String;
       var selected = new Array();
       var loopCounter = 0;
       jQuery("input[name=" + checklist + "]:checked").each(function () {
           //selected[loopCounter] = jQuery(this).val();
           resultString += jQuery(this).val() + ",";
           loopCounter += 1;
       });
       resultString = resultString + id.toString();
       selected.push(id);

       jQuery.post("/MyContr/Filter/", { resultStr: resultString });

   };
</script>

Filter Action in Controller - MyContr:

[AcceptVerbs(HttpVerbs.Post)]
    public RedirectToRouteResult Filter(String resultStr)
    {
        string strList = string.Empty;
        Stack<string> myStack = new Stack<string>( resultStr.Split(new string[] { "," }, StringSplitOptions.None));
        // Remove the id 
        var id = Convert.ToInt64(myStack.Pop());
       //convert rest of values (selected checkbox values) to string and pass to Review *was not able to pass array
       //build strList
        while (myStack.Count > 0)
        { 
            strList += myStack.Pop() +",";
        }

       if (strList != string.Empty)
           strList = strList.Remove(strList.Length - 1, 1); //remove last comma

        return RedirectToAction("Review", "myContr", new{id=id,filterList=strList});
    }

Review Action in Controller - MyContr:

[AcceptVerbs(HttpVerbs.Get)] 
    public ActionResult Review(long id, string filterList)
    {

        string[] strArray = new string[]{}; 
        int[] filterArray;

        if (filterList == null)
        {
            filterArray = new int[] { 14, 15 };//default to specific types
        }
        else
        {  //if filterList is not null

            strArray = filterList.Split(new string[] { "," }, StringSplitOptions.None); //split string into array
            //convert str[] to int[]
            filterArray = new int[strArray.Length];
            for (int x = 0; x < strArray.Length; x++)
            {
                filterArray[x] = Convert.ToInt32(strArray[x].ToString());
            }

        }
        var myData = something.GetMyData(id);

        ViewData["checkboxes"] = filterArray;
        return View(myData);
    }

my View that outputs the filtered list table within fieldset whose data rows are built by foreach( item in MyFilteredData)

*the html in my View is contained in an asp:Content block with no opening and closing html tags

The page loads correctly the first time with the defaulted filter showing the correct number of rows in my table; Changing the checkboxes to add to the filtered list does not update the html as expected; HOWEVER when I debug and step through the code, the correct data is passed through the actions and back to the view; it seems as though its just not rendering the new/updated html

Does anyone know why its not refreshing or rendering the updated filtered data even though I can step through and see what I expect to?

Answer 1

I am not a jQuery expert, but doesnt your post method need to specify a callback function that adds the returned html to an element in the DOM?

from jquery's page:

$.post('ajax/test.html', function(data) {
  $('.result').html(data);
});

http://api.jquery.com/jQuery.post/

where the returned html is appended to the element to the the .result class via the html method.

more from jquery's page:

Example: Request the test.php page, but ignore the return results.

$.post("test.php");

Example: Request the test.php page and send some additional data along (while still ignoring the return results).

$.post("test.php", { name: "John", time: "2pm" } );

Answer 2

There are 2 problems with your code. As @Francis Noriega points out, there needs to be a callback function in your jquery to populate the returned view back into the page.

However, the bigger issue is:

return RedirectToAction("Review", "myContr", new{id=id,filterList=strList});

This returns a HTTP 302 (redirect) to your jquery calling code, and not the html contents of the called action. You will need to change the action method to return a partial view.