Question

我的剃刀页面上有一个“btnGetAddress”按钮。在这个按钮的clik上，我调用一个Jquery来将我的addressItmes对象显示在我的View页面上。

点击“btnGetAddress”后，我可以点击"JsonResult GetAddresses()"并检索我的Jquery (success: function (data))中的记录。此数据有多个地址记录。但是我不知道如何把这些数据带到我看来。请帮我把我的数据显示在我的视图上

当我的页面加载时，用户只会看到“btnGetAddress”按钮。当用户点击btnGetAddress时，它将调用Jquery Click函数从数据库中获取所有地址记录并显示每组记录。页

$("#btnGetAddress").click(function () { 

                debugger;
                var selected = $("#ddlType").val();
                if (selected == "")
                { selected = 0; }
                var dataToSend = {
                    SelectedTypeId: selected
                };
                $.ajax({
                    type: "GET",
                    url: '@Url.Action("GetAddresses", "Content")',
                    data: { SelectedTypeId: selected },
                    success: function (data) {
                        debugger;

                    },

                    error: function (error) {
                        var verr = error;
                        alert(verr);
                    }

                });

下面粘贴的是我的JsonResult GetAddresses（），它被调用来检索addressItems

public JsonResult GetAddresses()
        {
   model.AddressItems = AddressService.RetrieveAllAddress(); 
 // My AddressItems is of type IEnumerable<AddressItems>   


 return Json(model.AddressItems, JsonRequestBehavior.AllowGet);
}

这是我的剃刀查看页面，其中显示地址记录。

 ........................

  <input type="submit" id="btnGetAddress" name="btnSubmit" value="Show Addresses" />

  if (!UtilityHelper.IsNullOrEmpty(Model.AddressItems))
    {

        foreach (var AddressRecord in Model.AddressItems)
        {
    <fieldset >
        <legend style="padding-top: 10px; font-size: small;">Address Queue(@Model.NumRecords)
        </legend>
        <table>
            <tr>
                <td>
                    <span>Index</span>

                </td>
                <td>
                </td>
                <td>
                    <input type="submit" id="btnDelete" name="btnSubmit" value="X" />
                    <br />
                </td>
            </tr>
            <tr>
                <td>
                    <span>Address1</span>
                    <br />
                </td>
                <td>
                    @Html.EditorFor(model => AddressRecord.Address )
                    @Html.ValidationMessageFor(model => AddressRecord.Address)
                </td>
            </tr>
            <tr>
                <td>
                    <span>Description</span>
                    <br />
                </td>
                <td>
                    @Html.EditorFor(model => AddressRecord.Description)
                    @Html.ValidationMessageFor(model => AddressRecord.Description)
                </td>
            </tr>
           <tr>
                <td>
                    <input type="submit" id="btnSave" name="btnSubmit" value="Save" />
                </td>
                <td>
                    <input type="submit" id="btnDelete" name="btnSubmit" value="Delete" />
                </td>
            </tr>
        </table>
    </fieldset>
        }
        }

    <fieldset>

或者有没有更好的方法来实现我的目标？

Answer 1

由于您是通过ajax获取数据，因此您应该使用jquery模板引擎。基本上以您的方式获取数据，并在成功时执行类似

的操作

<script language="javascript" type="text/javascript">
    $(function () {
        $.getJSON("/getprojects", "", function (data) {
            $("#projectsTemplate").tmpl(data).appendTo("#projectsList");
        });
    });
</script>

<script id="projectsTemplate" type="text/html">
    <section>
        <header><h2>Projects</h2></header>
        <table id="projects">
            <th>Name</th>
            {{tmpl(items) "#projectRowTemplate"}}
        </table>
    </section>
</script>

<script id="projectRowTemplate" type="x-jquery-tmpl">
  <tr>
    <td><a href="/show/${id}">${name}</a></td>
  </tr>
</script>

<div id="projectsList"></div>

现在每个模板引擎都不同，但上面的内容让您了解自己可以做什么

Answer 2

如果要在控制器中返回JSON对象，则必须将视图转换为字符串并将其作为消息的一部分返回。如果你谷歌有一些方法可以做到这一点。

然而，我真的认为这很难，为什么不从控制器中的JSON获取数据并将其放入MODEL中，然后返回传入模型数据的VIEW。我认为这是更简单的方法。

如何从Jquery检索多个记录到我的RazorView页面

2 个答案: