CODEWITHSUNDEEP
jqueryajaxasp.net-mvc
Craig
Craig

Reputation: 18734

Refresh screen after Ajax call

I make a call to my controller, after a drop down is changed, which should return a new set of data for the screen, and refresh the screen.

function refresh() {
        var orderId = $(".cmbFilter").val();
        var accountId = $(".accountId").val();
        $.ajax({
            url: '@Url.Action("Transactions", "Transaction")',
            type: "POST",
            contentType: "application/json",
            data: JSON.stringify({ bankAccountId: accountId, filterId: orderId }),
            cache: false,
            async: true,
            success: function (result) {

                if (result.Success == 'true') {

                } else {
                }
            },
            error: function () {
                alert("Oh no...");
            }

        });
        return (false);

The call is made, the breakpoint in the controller is hit... but after the new model is returned - the screen doesn't refresh. How do I make the screen refresh?

I guess a simpler way would be something like this:

function refresh() {
    var orderId = $(".cmbFilter").val();
    var accountId = $(".accountId").val();
     window.location = '@Url.Action("Transactions", "Transaction", new {bankAccountId = orderId, filterId = accountId })';
}

However, it doesn't like my parameters (even when I use orderBy and accountId). What's wrong with the last attempt?

Says "It can't find symbol orderId and accountId"

Upvotes: 0

Views: 1582

Answers (2)

SethMW
SethMW

Reputation: 1082

What I've done in your situation:

  1. Put the html table in a partial view.
  2. Create a controller action to retrieve data for it, return it, etc.
  3. Put a div (id="myDiv") on your main view, with RenderAction("MyNewAction") inside it to get the initial load of the table/partial view
  4. On some action, make your ajax call to the new action (note the content type change)

  5. "Re-populate" the table with the result of the call to your new action:

    contentType: "html", success: function (result) { $("#myDiv").html(result); }

Upvotes: 1

Steve Wellens
Steve Wellens

Reputation: 20640

if (result.Success == 'true') 
{
    // refresh your drop down here
} 
else 
{
    // do you really want to hide and ignore error messages?
}

Upvotes: 0

Related Questions