Asp.net mvc 从控制器获取json数据？

脚本：

<script type="text/javascript">
function getMeterInfo(meter_id) {
    $.ajax({
        url: '@Url.Action("MeterInfo", "Power")',
        data: { meter_id: meter_id},
        dataType: "json",
        type: "GET",
        error: function () {
            alert("Error!");
        },
        success: function (data) {
            var item = "";
            item += data.sno + " " + data.customer_id + data.city + data.region; //+ more info about meter.

            $("#meter_info").html(item);
        }
    });
}

$(document).ready(function () {
    $("#meters").change(function () {
        var meter_id = $("#meters").val();
        getMeterInfo(meter_id);
    });
});
</script>

模型

我想在html表格中显示我的模型值（sno、customer_id、city、region等）。调试程序时，控制器操作返回预期数据

我不知道如何在名为meter_info的表上显示返回的数据项

当我运行上述代码时，错误函数起作用，而不是成功函数

如何在表格上显示数据？为什么误差函数起作用

---

谢谢。

您能否验证是否使用firebug等调用了success函数。。。？或者只是在里面放一个警报（‘被叫了！’）的老一套

此外：

1） 您发布的以下代码使用了一个名为item的变量和另一个名为items的变量。这是您的意图，因为您正在将内部html设置为空字符串

    var **item** = "";
    **items** += data.sno + " " + data.customer_id + data.city + data.region; 

    $("#meter_info").html(**item**);

2） 如果您想循环遍历结果并为每个结果添加一个表行：您可能想使用jQuery“each”来实现这一点，但进一步检查时，您似乎只是通过这个结果显示了一条记录。奇怪的是，您使用表只显示一行

要添加一个结果（当然，您可能希望将其划分为多个列）：

$（'#仪表信息'）。附加（''+data.sno
+''+data.customer\u id+data.city+data.region+''数据

如果要返回并追加多行：

    $.each(data, function(index,data){$('#meter_info').append('<tr><td>' + data.sno 
       + ' ' + data.customer_id + data.city + data.region + '</td></tr>' };

$。每个（数据、函数（索引、数据）{$（'meter#u info'）。追加（''+data.sno
+''+data.customer_id+data.city+data.region+''}；

若这是一种选择，我建议使用不引人注目的AJAX来完成这项工作。它需要大量的工作，而且可以为您完成

因此，根据您正在尝试的内容，您可能希望创建一个强类型的局部视图，该视图接受TableMeters列表作为其模型类（请原谅我缺少Razor，但我更喜欢C#…）

---

就传递的内容而言，请仔细检查逻辑，我不完全确定您的所有类都是什么样子，但这应该可以解决问题。当您更改下拉列表时，它将触发“onchange”事件，该事件应提交包含表单。表单将通过AJAX提交给控制器。请注意，下拉列表的名称必须与控制器方法的参数匹配。您可以像已完成筛选一样进行筛选，并将列表返回到部分视图。部分视图将填充并替换div的内容。

我想知道您的序列化是否正常工作。如果更改此选项，会发生什么情况：

return Json(_meter, JsonRequestBehavior.AllowGet);

到

此外，如果您可以检查开发人员工具栏（大多数浏览器中为F12）的网络选项卡来检查响应是什么，这将非常有帮助

更新

您可以检查您的数据是如何序列化的。如果您使用的是内置序列化器/反序列化器，那么您可以尝试以下方法

var serializer = new JavaScriptSerializer();
var json = serializer.Serialize(yourData);

使用JSON.NET

var json = JsonConvert.SerializeObject(yourData, jsonSerializerSettings);

---

非常感谢。这就是解决方案。局部视图也是一个好的解决方案吗？我应该选择哪一个？@AliRızaAdıyahşI这是一个品味和要求的问题。如果你返回JSON，那么你可以对其他客户端使用相同的数据，比如本地移动设备应用程序，只需以不同的方式呈现它。或者你可以在我的仪表类中将其用于公共API25值。如果我使用此方法，Json函数将增长。@AliRızaAdıyahş我尝试在return语句之外序列化数据，那么您可能会注意到序列化中的问题process@AliRıza Adıyahşi-使用局部视图的好处是，您不必使用jQuery根据结果构建HTML，但正如Tx3所说，它是这是一个品味的问题，以及你能对你的需求做些什么。

    $.each(data, function(index,data){$('#meter_info').append('<tr><td>' + data.sno 
       + ' ' + data.customer_id + data.city + data.region + '</td></tr>' };

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<List<TableMeters>>" %>
    <table>
    <% foreach(TableMeter meter in Model){ %>
        <tr>
            <td><%= meter.sno %></td>
            <td>...</td>
        </tr>
    <% } %>

<% using(Ajax.BeginForm("MeterInfo", "Power", new AjaxOptions() { UpdateTargetId = "meterTable" })){ %>
    <%= Html.DropDownList("meter_id", new SelectList(Model, "sno", "meter_name"), "-- Select Meter --", new { id = "meters", onchange="$(this).parent().submit()" }) %>
<% } %>

<div id="meterTable">
    <%= Html.Partial("MeterTable", Model.TblMeters) %>
</div>

return PartialView("MeterTable", _meter);

return Json(_meter, JsonRequestBehavior.AllowGet);

return Json(new { sno = _meter.sno, customer_id = _meter.customer_id etc. }, JsonRequestBehavior.AllowGet);

var serializer = new JavaScriptSerializer();
var json = serializer.Serialize(yourData);

var json = JsonConvert.SerializeObject(yourData, jsonSerializerSettings);