Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
638 views
in Technique[技术] by (71.8m points)

ajax - "UpdatePanel" in Razor (mvc 3)

Is there something like UpdatePanel (in ASPX) for Razor?

I want to refresh data (e.g. table, chart, ...) automaticly every 30 seconds. Similar to clicking the following link every 30 seconds:

 @Ajax.ActionLink("Refresh", "RefreshItems", new AjaxOptions() {
     UpdateTargetId = "ItemList",
     HttpMethod = "Post"})

Edit:

I may should add that the action link renders a partial view.

Code in cshtml:

<div id="ItemList">
  @Html.Partial("_ItemList", Model)
</div>

Code in Controller:

    [HttpPost]
    public ActionResult RefreshItems() {
        try {
            // Fill List/Model
            ... 

            // Return Partial
            return PartialView("_ItemList", model);
        }
        catch (Exception ex) {

            return RedirectToAction("Index");
        }
    }

It would be create if the PartielView could refresh itself.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You can try something similar to the following using Jquery (have not tested though)

<script type="text/javascript">
   $(document).ready(function() {
        setInterval(function()
        {
         // not sure what the controller name is
          $.post('<%= Url.Action("Refresh", "RefreshItems") %>', function(data) {
           // Update the ItemList html element
           $('#ItemList').html(data);
          });
        }
        , 30000);
   });
</script>

The above code should be placed in the containing page i.e. not the partial view page. Bear in mind that the a partial view is not a complete html page.

My initial guess is that this script can be placed in the partial and modified as follows. Make sure that the ajax data type is set to html.

<script type="text/javascript">
    setInterval(function()
    {
      // not sure what the controller name is
      $.post('<%= Url.Action("Refresh", "RefreshItems") %>', function(data) {
        // Update the ItemList html element
        $('#ItemList').html(data);
      });
    }
    , 30000);
</script>

Another alternative is to store the javascript in a separate js file and use the Jquery getScript function in ajax success callback.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...