Home/ Questions/Q 6884175
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T05:28:29+00:00

In an ASP.NET MVC app I use jQuery for posting data on button-click: <button

  • 0

In an ASP.NET MVC app I use jQuery for posting data on button-click:

<button onclick="addProducts()">Add products</button>
....
$.post('<%= Url.Action("AddToCart", "Cart") %>',
            {
                ...
                returnUrl: window.location.href
            });

In the “AddToCart” action of “Cart” controller I use redirection to another View after posting:

    public RedirectToRouteResult AddToCart(..., string returnUrl)
    {
        ...
        return RedirectToAction("Index", new { returnUrl });            
    }

All is okay, except this redirection. I stay on the same page after posting. I suspect it’s due to AJAX type of “POST” request.

How to solve the problem with jQuery POST request blocking the redirection?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I created a $.form(url[, data[, method = 'POST']]) function which creates a hidden form, populates it with the specified data and attaches it to the <body>. Here are some examples:

    $.form('/index')

<form action="/index" method="POST"></form>

    $.form('/new', { title: 'Hello World', body: 'Foo Bar' })

<form action="/index" method="POST">
    <input type="hidden" name="title" value="Hello World" />
    <input type="hidden" name="body" value="Foo Bar" />
</form>

    $.form('/info', { userIds: [1, 2, 3, 4] }, 'GET')

<form action="/info" method="GET">
    <input type="hidden" name="userIds[]" value="1" />
    <input type="hidden" name="userIds[]" value="2" />
    <input type="hidden" name="userIds[]" value="3" />
    <input type="hidden" name="userIds[]" value="4" />
</form>

    $.form('/profile', { sender: { first: 'John', last: 'Smith', postIds: null },
                     receiver: { first: 'Foo', last: 'Bar', postIds: [1, 2] } })

<form action="/profile" method="POST">
    <input type="hidden" name="sender[first]" value="John">
    <input type="hidden" name="sender[last]" value="Smith">
    <input type="hidden" name="receiver[first]" value="John">
    <input type="hidden" name="receiver[last]" value="Smith">
    <input type="hidden" name="receiver[postIds][]" value="1">
    <input type="hidden" name="receiver[postIds][]" value="2">
</form>

    With jQuery’s .submit() method you can create and submit a form with a simple expression:

    $.form('http://stackoverflow.com/search', { q: '[ajax]' }, 'GET').submit();

    Here’s the function definition:

    jQuery(function($) { $.extend({
    form: function(url, data, method) {
        if (method == null) method = 'POST';
        if (data == null) data = {};

        var form = $('<form>').attr({
            method: method,
            action: url
         }).css({
            display: 'none'
         });

        var addData = function(name, data) {
            if ($.isArray(data)) {
                for (var i = 0; i < data.length; i++) {
                    var value = data[i];
                    addData(name + '[]', value);
                }
            } else if (typeof data === 'object') {
                for (var key in data) {
                    if (data.hasOwnProperty(key)) {
                        addData(name + '[' + key + ']', data[key]);
                    }
                }
            } else if (data != null) {
                form.append($('<input>').attr({
                  type: 'hidden',
                  name: String(name),
                  value: String(data)
                }));
            }
        };

        for (var key in data) {
            if (data.hasOwnProperty(key)) {
                addData(key, data[key]);
            }
        }

        return form.appendTo('body');
    }
}); });
    • 0