2013-08-15 23 views
13

Ey! Come posso aggiornare una vista parziale con i dati fuori dal modello? La prima volta, quando la pagina viene caricata, funziona correttamente, ma non quando la chiamo dall'azione. La struttura che ho creato assomiglia:Aggiornamento PartialView mvc 4

Ovunque nel mio punto di vista:

@{ Html.RenderAction("UpdatePoints");} 

miei PartialView "UpdatePoints":

<h3>Your points are @ViewBag.points </h3> 

Al controller ho:

public ActionResult UpdatePoints() 
     { 

      ViewBag.points = _Repository.Points; 
      return PartialView("UpdatePoints"); 
     } 

Grazie per il vostro aiuto!

UPDATE

Grazie a tutti per il vostro aiuto! Finalmente ho usato JQuery/AJAX come suggerito, passando il parametro usando il modello.

Così, in JS:

$('#divPoints').load('/Schedule/UpdatePoints', UpdatePointsAction); 
var points= $('#newpoints').val(); 
$element.find('PointsDiv').html("You have" + points+ " points"); 

In Controller:

var model = _newPoints; 
return PartialView(model); 

In vista

<div id="divPoints"></div> 
@Html.Hidden("newpoints", Model) 
+0

Stai cercando di utilizzare AJAX per questo? –

+0

La tua domanda non è chiara, quando funziona e quando no? Mostraci il codice che stai utilizzando per entrambi i tipi –

risposta

15

Quindi, dire che hai la tua vista con PartialView, che devono essere aggiornati con il tasto clic:

<div class="target"> 
    @{ Html.RenderAction("UpdatePoints");} 
</div> 

<input class="button" value="update" /> 

Ci sono alcuni modi per farlo. Ad esempio si può utilizzare jQuery:

<script type="text/javascript"> 
    $(function(){  
     $('.button').on("click", function(){   
      $.post('@Url.Action("PostActionToUpdatePoints", "Home")').always(function(){ 
       $('.target').load('/Home/UpdatePoints');   
      })   
     }); 
    });   
</script> 

PostActionToUpdatePoints è l'attributo Action con [HttpPost], che si usa per aggiornare i punti

Se si utilizza logica nei UpdatePoints azione() per aggiornare i punti, forse ti sei dimenticato di aggiungi all'attributo [HttpPost]:

[HttpPost] 
public ActionResult UpdatePoints() 
{  
    ViewBag.points = _Repository.Points; 
    return PartialView("UpdatePoints"); 
} 
+4

, questa soluzione funziona. poche riparazioni però. Se si inserisce l'annotazione HttpPost, non sarà possibile eseguire la funzione di caricamento di jquery. rimuovere l'annotazione. la funzione "Carica" ​​è in minuscolo. e il metodo post è "$ .post" invece di $ post. aggiusta queste piccole cose e funzionerà come un incantesimo – Nelssen

1

Grazie a tutti per il vostro aiuto! Infine ho usato JQuery/AJAX come suggerito, passando il parametro usando il modello.

Così, in JS:

$('#divPoints').load('/Schedule/UpdatePoints', UpdatePointsAction); 
var points= $('#newpoints').val(); 
$element.find('PointsDiv').html("You have" + points+ " points"); 

In Controller:

var model = _newPoints; 
return PartialView(model); 

In vista

<div id="divPoints"></div> 
@Html.Hidden("newpoints", Model) 
7

Si può anche provare questo.

$(document).ready(function() { 
      var url = "@(Html.Raw(Url.Action("ActionName", "ControllerName")))"; 
      $("#PartialViewDivId").load(url); 
     setInterval(function() { 
      var url = "@(Html.Raw(Url.Action("ActionName", "ControllerName")))"; 
      $("#PartialViewDivId").load(url); 
     }, 30000); //Refreshes every 30 seconds 

     $.ajaxSetup({ cache: false }); //Turn off caching 
    }); 

Fa una chiamata iniziale per caricare il div, e quindi le chiamate successive sono su un intervallo di 30 secondi.

Nella sezione del controller è possibile aggiornare l'oggetto e passare l'oggetto alla vista parziale.

public class ControllerName: Controller 
{ 
    public ActionResult ActionName() 
    { 
     . 
     . // code for update object 
     . 
     return PartialView("PartialViewName", updatedObject); 
    } 
}