使用从ajax调用返回的数据更新EditorTemplate

时间:2015-10-19 09:23:55

标签: html ajax asp.net-mvc-5

我有一个EditorTemplate,它使用以下内容从主视图渲染:

@Html.EditorFor(model => Model.Alarms)

Model.Alarms中的数据将通过以下调用以常规速率刷新并返回:

 $(document).ready(function () {
    $('#updateAlarms').click(function () {
        $.ajax({
            type: "POST",
            url: '@Url.Action("updateAlarms", "Dashboard")',
            dataType: "json",
            success: successFunc
        });

        function successFunc(data, status) {
            alert('success');
        }

        function errorFunc() {
            alert('error');
        }
    });
});

EditorTemplate看起来像这样:

@{
    ViewBag.Title = "Dashboard";
}

<div class="panel panel-primary">
    <div class="@GetBackgroundColour(Model.IsConditionNormal)" id="alarmTitleBackground">
        <div class="panel-heading">
            <h3 class="panel-title alarmDescription" style="text-align:center">@Html.DisplayFor(model => model.ConditionDescription)</h3>
        </div>
    </div>
    <div class="@GetBackgroundColour(Model.IsConditionNormal)" id="alarmTextBackground">
        <table style="text-align:left">
            <tr>
                <td><p class="alarmLabel1" style="color:white">@Html.DisplayFor(model => model.AlarmLabel1)</p></td>
                <td><p class="alarmValue1" style="color:white">@Html.DisplayFor(model => model.AlarmValue1)</p></td>
            </tr>
            <tr>
                <td><p class="alarmLabel2" style="color:white">@Html.DisplayFor(model => model.AlarmLabel2)</p></td>
                <td><p class="alarmValue2" style="color:white">@Html.DisplayFor(model => model.AlarmValue2)</p></td>
            </tr>
            <tr>
                <td><p class="alarmLabel3" style="color:white">@Html.DisplayFor(model => model.AlarmLabel3)</p></td>
                <td><p class="alarmValue3" style="color:white">@Html.DisplayFor(model => model.AlarmValue3)</p></td>
            </tr>
        </table>
    </div>
</div>

目前我无法弄清楚如何将ajax调用中返回的数据链接到传递给EditorFor的数据,我该怎么做?

更新:

这是我的剪切视图模型:

    public class DashboardViewModel
{
    public List<SSAlarm> Alarms { get; set; }
}

public class SSAlarm
{
    public Boolean IsConditionNormal { get; set; }
    public String ConditionDescription { get; set; }
    public String AlarmLabel1 { get; set; }
    public String AlarmValue1 { get; set; }
    public String AlarmLabel2 { get; set; }
    public String AlarmValue2 { get; set; }
    public String AlarmLabel3 { get; set; }
    public String AlarmValue3 { get; set; }
}

还有一个控制器动作的临时版本,用于显示正在返回的内容(我此刻已在此处硬编码了返回数据):

public JsonResult UpdateAlarms(String id)
    {
        DashboardViewModel model = new DashboardViewModel();

        model.Alarms = new List<SSAlarm>()
        {
            new SSAlarm
            {
                ConditionDescription = "Condition Normal",
                IsConditionNormal  = true
            },

            new SSAlarm
            {
                ConditionDescription = "Lost neutral alarm",
                IsConditionNormal = false,
                AlarmLabel1 = "Phase Voltage Red:",
                AlarmValue1 = "230V",
                AlarmLabel2 = "Phase Voltage Yellow:",
                AlarmValue2 = "231V",
                AlarmLabel3 = "Phase Voltage Blue:",
                AlarmValue3 = "232V"
             }
        };

        return Json(model);
    }

0 个答案:

没有答案