Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>First you want to have jQuery "intercept" the form post. You will then let jQuery take care of posting the form data using ajax:</p> <pre><code>$("form").submit(function (event) { event.preventDefault(); //display loading $("#loadingDialog").dialog("open"); $.ajax({ type: $('#myForm').attr('method'), url: $('#myForm').attr('action'), data: $('#myForm').serialize(), accept: 'application/json', dataType: "json", error: function (xhr, status, error) { //handle error $("#loadingDialog").dialog("close"); }, success: function (response) { $("#loadingDialog").dialog("close"); } }); }); </code></pre> <p>More information on the $.ajax() method is here: <a href="http://api.jquery.com/jQuery.ajax/" rel="nofollow">http://api.jquery.com/jQuery.ajax/</a></p> <p>You could use the jquery dialog to display your message: <a href="http://jqueryui.com/dialog/" rel="nofollow">http://jqueryui.com/dialog/</a></p> <p>There are other ways to display a loading message. It could be as simple as using a div with a loading image (<a href="http://www.ajaxload.info/" rel="nofollow">http://www.ajaxload.info/</a>) and some text, then using jQuery to <code>.show()</code> and <code>.hide()</code> the div.</p> <p>Then, in your controller, just make sure you're returning <code>JsonResult</code> instead of a view. Be sure to mark the Controller action with the <code>[HttpPost]</code> attribute.</p> <pre><code>[HttpPost] public JsonResult TestControllerMethod(MyViewModel viewModel) { //do work return Json(true);//this can be an object if you need to return more data } </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload