MVC 3.0 JQUERY 部分页面更新答案

【问题标题】：MVC 3.0 JQUERY Partial page updateMVC 3.0 JQUERY 部分页面更新
【发布时间】：2012-06-13 11:50:47
【问题描述】：

我有一个 JQuery UI 日期选择器。选择日期后，图表上的数据会发生变化。

问题是当我在日期选择器上选择日期时，整个页面都会刷新并且数据会被填充。

无论如何，我可以更新标签上的图表吗？请注意，选择日期后，jquery 会发布到服务器并获取所选日期的新数据。

我正在使用$.ajax({ }); 调用服务器。我原以为这会起到作用，但事实并非如此。

任何帮助将不胜感激。

【问题讨论】：

您可能需要实现 ajax 函数来更新图形以避免页面刷新。你如何更新图表？在服务器端？
图表使用 JSON 和 knockout.js 进行更新。如果无论如何我可以将数据选择器与 KO 连接起来，那就太好了。
如果它通过 javascript 从 JSON 源更新，您可能不需要 ajax。尝试添加“return false;”在函数结束时更新图表。它将阻止回发事件到服务器。
谢谢@Jonas-Thein，但请求需要到达服务器。我想进行部分页面更新，以便即使已向后台服务器发出请求，也不会刷新整个页面。
你能在问题中发布一些标记和你的js调用吗？

标签： jquery asp.net jquery-ui

【解决方案1】：

我不知道你的方法的名称，div，如果有帮助，请相应地更改。尝试如下操作：

        $("#DateDiv").datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        dateFormat: "yy/mm/dd",
        onSelect: function (dateText, inst)
        {
            UpdateGraph(dateText);
        },
        onChangeMonthYear: function(year, month, inst) 
        { 
            $.ajax({
                async: false,
                cache: false,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                url: "@Url.Action("LoadGraph", "YourController")",
                data:
                {
                    date: new Date(year, month - 1, 1).toString("yyyy/MM/dd")
                },
                success: function (data)
                {
$("#UpdateGraphDataDiv").html(data);
                                   },
                error: function (request, status, error)
                {
                    DisplayErrorMessageBox(ParseErrorFromResponse(request.responseText, "Unknown error"), true);
                }
            });
        }

【讨论】：

【解决方案2】：

你需要类似的东西

$('button').click(function(event){ 
   event.preventDefault();
   $.ajax({ ... } );
});

【讨论】：

【解决方案3】：

试试这个

$('#datepickerid').datepicker({
   onSelect: function(dateText, inst) { 
     $.ajax({ ... } );
     return false;
   }
});

【讨论】：