Json序列化绑定到剃刀视图模型类

时间:2013-04-25 04:17:57

标签: json asp.net-mvc-4 entity-framework-5 razor-2

您好我在名为data的变量中返回了以下JSON。

{"tblMaster":{"intMasterID":14,"intMasterRegionID":1,"intMasterDistrictID":1,"intMasterEduLevelID":2,"txtMasterName":"Kureme","txtMasterPreciseLocation":"bulinga","txtMasterPostalAddress":"bulinga},"txtproperty1":"null"}

我使用MasterBo Model类生成了一个剃刀页面。 在那个MasteBo类中,我编写了以下代码

public class MasteBo 
{
    public tblMaster tblMaster { get; set; }
    public string  tproperty1 { get; set; }
}

Razor页面代码

<div id="tabs-1">
    <table>

        <tr>
            <td>Region:</td>
            <td style="width:255px">

                @Html.DropDownListFor(model => model.tblMaster.intMasterRegionID, (IEnumerable<SelectListItem>)ViewBag.intMasterRegionID, "--Select--", new { id = "tblMaster_intMasterRegionID",style="width:255px" })
        </td><td> @Html.ValidationMessageFor(model => model.tblMaster.intMasterRegionID)</td>
        </tr>
        <tr>
            <td>District:</td>
            <td style="width:255px">
                @Html.DropDownListFor(model => model.tblMaster.intMasterDistrictID, (IEnumerable<SelectListItem>)ViewBag.intMasterDistrictID, "--Select--")</td>
            <td>@Html.ValidationMessageFor(model => model.tblMaster.intMasterDistrictID)</td>
        </tr>

        <tr>
            <td>Education Level</td>
            <td style="width:255px">
                @Html.DropDownListFor(model => model.tblMaster.intMasterEduLevelID, (IEnumerable<SelectListItem>)ViewBag.MasterEducationalLevels, "--Select--")   </td>
            <td> @Html.ValidationMessageFor(model => model.tblMaster.intMasterEduLevelID)</td>
        </tr>
        <tr>
            <td>Master Name:</td>
            <td style="width:255px">
                    @Html.DropDownListFor(model => model.tblMaster.intMasterID, (IEnumerable<SelectListItem>)ViewBag.Masters, "--Select--")</td>
            <td> @Html.ValidationMessageFor(model => model.tblMaster.txtMasterName)</td>
        </tr>
        <tr>
            <td>Precise Location:</td>
            <td>
                @Html.EditorFor(model => model.tblMaster.txtMasterPreciseLocation)</td> 
            <td>@Html.ValidationMessageFor(model => model.tblMaster.txtMasterPreciseLocation)</td>
        </tr>
        <tr>
            <td>Postal Address:</td>
            <td>
                @Html.TextAreaFor(model => model.tblMaster.txtMasterPostalAddress) </td>
            <td>@Html.ValidationMessageFor(model => model.tblMaster.txtMasterPostalAddress)</td>

        </tr>

        <tr>
    </table>
</div>

现在关于ajax请求的补充我如何将上面的Json数据绑定到页面。

1 个答案:

答案 0 :(得分:0)

您可以返回部分视图,而不是从控制器操作返回JSON。因此,让我们将您展示的内容放在部分内容中:

_MyPartial.cshtml

@model MasteBo
<table>
    <tr>
        <td>Region:</td>
        <td style="width:255px">
            @Html.DropDownListFor(model => model.tblMaster.intMasterRegionID, (IEnumerable<SelectListItem>)ViewBag.intMasterRegionID, "--Select--", new { id = "tblMaster_intMasterRegionID",style="width:255px" })
        </td>
        <td>@Html.ValidationMessageFor(model => model.tblMaster.intMasterRegionID)</td>
    </tr>
    <tr>
        <td>District:</td>
        <td style="width:255px">
            @Html.DropDownListFor(model => model.tblMaster.intMasterDistrictID, (IEnumerable<SelectListItem>)ViewBag.intMasterDistrictID, "--Select--")</td>
        <td>@Html.ValidationMessageFor(model => model.tblMaster.intMasterDistrictID)</td>
    </tr>
    <tr>
        <td>Education Level</td>
        <td style="width:255px">
            @Html.DropDownListFor(model => model.tblMaster.intMasterEduLevelID, (IEnumerable<SelectListItem>)ViewBag.MasterEducationalLevels, "--Select--")   </td>
        <td>@Html.ValidationMessageFor(model => model.tblMaster.intMasterEduLevelID)</td>
    </tr>
    <tr>
        <td>Master Name:</td>
        <td style="width:255px">
            @Html.DropDownListFor(model => model.tblMaster.intMasterID, (IEnumerable<SelectListItem>)ViewBag.Masters, "--Select--")</td>
        <td>@Html.ValidationMessageFor(model => model.tblMaster.txtMasterName)</td>
    </tr>
    <tr>
        <td>Precise Location:</td>
        <td>
            @Html.EditorFor(model => model.tblMaster.txtMasterPreciseLocation)</td> 
        <td>@Html.ValidationMessageFor(model => model.tblMaster.txtMasterPreciseLocation)</td>
    </tr>
    <tr>
        <td>Postal Address:</td>
        <td>
            @Html.TextAreaFor(model => model.tblMaster.txtMasterPostalAddress)</td>
        <td>@Html.ValidationMessageFor(model => model.tblMaster.txtMasterPostalAddress)</td>
    </tr>
</table>

在主视图中,您将包括渲染此部分:

<div id="tabs-1">
    @Html.Partial("_MyPartial")
</div>

好的,现在您可以对某些控制器操作发出AJAX请求:

$.ajax({
    url: '/somecontroller/someaction',
    type: 'GET',
    cache: false,
    success: function(data) {
        $('#tabs-1').html(data);
    }
});

并且控制器操作将返回部分视图而不是JSON对象:

public ActionResult SomeAction()
{
    MasteBo model = ... fetch your model the same way you were doing in the action that was returning JSON
    return PartialView("_MyPartial", model);
}