[MVC4] Visualizzare i progressi del server nella view.

[EnSa]

Vorrei visualizzare al momento dell'invio di un modulo i progressi che compie l'ActionResult nella pagina ...

ho provato in questo modo:

    public class HomeController : Controller
    {
        public string currentStatus = string.Empty;
        //
        // GET: /Home/

        public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public ActionResult Index(int aa = 0)
        {
            System.Threading.Thread.Sleep(2000);
            currentStatus = "prima";
            System.Threading.Thread.Sleep(2000);
            currentStatus = "seconda";
            System.Threading.Thread.Sleep(3000);
            currentStatus = "terza";
            System.Threading.Thread.Sleep(1000);
            currentStatus  = "quarta";
            System.Threading.Thread.Sleep(4000);
            currentStatus = "quinta";

            return View();
        }

        public ActionResult Progress(string test)
        {
            this.ControllerContext.HttpContext.Response.AddHeader("cache-control", "no-cache");
            return Json(currentStatus);
        }
    }

<script type="text/javascript">
 
function updateMonitor(status) {
    $("#currProgress").html("[currProgress]: " + status);
}

function Executefunc() {
                $.ajax(
                {
                    type: "Post",
                    url: "/Home/Progress",
                    data: { test: "aaa" },
                    dataType: "script",
                    success: function (progress) {
                        //alert(result);
                        if (progress >= 100) {
                            updateMonitor("Completed");
                            clearInterval(intervalId);
                        } else {
                            updateMonitor(progress + "%");
                        }
                        //window.open(result, "Ann")//Open the returned URL in a window
                    },
                    error: function (req, status, error) {
                        alert("An error occurred while processing your request.");
                    }
                });
            }, 100);
        }
 </script>

@using (Html.BeginForm())
{
    <input id="submitbtnbs" name="btnSubmit" type="submit" onclick="javascript: return Executefunc();" value="invia" />
}

<div id="monitors">
    <p id="currProgress"></p>

</div>

il post me lo esegue correttamente ...

solo che non mi richiama l'ActionResult Progress ...

Come posso risolvere???
Qualche consiglio??

Grazie in anticipo.

[EnSa]

Ho provato a modifcare un pò di cose:

    public class HomeController : Controller
    {
        public string currentCompany = "prova";
        //
        // GET: /Home/

        public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public ActionResult Index(int aa = 0)
        {
            System.Threading.Thread.Sleep(2000);
            currentCompany = "prima";
            System.Threading.Thread.Sleep(2000);
            currentCompany = "seconda";
            System.Threading.Thread.Sleep(3000);
            currentCompany = "terza";
            System.Threading.Thread.Sleep(1000);
            currentCompany = "quarta";
            System.Threading.Thread.Sleep(4000);
            currentCompany = "quinta";

            return View();
        }

        public string Progress()
        {
            return currentCompany;
        }
    }

<script src="/Scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script type="text/javascript">
 function updateMonitor() {
     var url = "/Home/Progress";
     $.get(url, null, function (data) {
         $("#currCompany").html("Task [currCompany]: " + data);
     });
 }

function ConfirmationBox() {
            var result = confirm("Sei sicuro?");
            if (result == false) {
                return false;
            }
            setInterval("updateMonitor()", 100);
}

@using (Html.BeginForm())
{
    <input id="submitbtnbs" name="btnSubmit" type="submit" onclick="javascript: return ConfirmationBox();" value="invia" />
}

<button id="start" onclick="javascript: return ConfirmationBox();">Start</button>

<div id="monitors">
    <p id="currCompany"></p>

</div>

ora non riesco a capire perchè se utilizzo "input submit" esegue il post ma non mi restituisce niente nell' updateMonitor(), mentre se utilizzo un button l'updateMonitor() funziona correttamente ma ovviamente non esegue il post...



Qualche idea su come risolvere???

Grazie

[EnSa]

up...

[rsdpzed]

a grandi linee.

lato server:
1 devi avere una action che effettua il vero lavoro e che progressivamente memorizzi in una variabile di sessione il progress di questo lavoro.
2 devi avere un altra action (di tipo get) che accetta solo chiamate ajax, che legge lo stato della variabile di sessione e la ritorna sottoforma di testo o di json.

devi usare la sessione perchè ogni chiamata http o ajax crea un istanza di controller nuova e quindi devi usare qualcosa come la session per memorizzare i vari stadi del lavoro.

lato client:
1 con js devi intercettare il click del pulsante di submit del form e attraverso preventDefault devi impedire che il form venga inviato via http.
2 devi inviare i dati alla action con $.ajax o con $.post, recuperando a mano i valori dei controlli all'interno del form e concatendandoli nella stringa 'data'
3 prima di effettuare la chiamata ajax devi far partire con setinterval una funzione che richiami costantemente la action di tipo get che legge lo stato della chiamata e ne scrive la risposta da qualche parte. Per questo scopo devi usare sempre $.ajax o $.get
4 negli handler della chiamata ajax post (success, complete, error) devi interrompere la chiamate e fornire (e gestire) un ultima volta il risultato, quello ritornato dalla action che svolge il lavoro.

tutto nell'handler 'click' del pulsante di submit.