如何从加载了ajax调用的局部视图中获取主视图中的值?

时间:2018-03-22 12:48:55

标签: jquery asp.net-mvc partial-views

我正在研究MVC项目,其中我有主视图,我通过传递参考号使用ajax调用加载局部视图。 它的工作原理如下。我通过输入参考号来下订单,当我添加参考号时,它通过控制器上的ajax调用在变更事件中检查数据库中的参考号是否已存在任何订单。如果存在针对该引用表的任何订单,则在部分视图中加载。                现在我真正想要的是在主视图中加载局部视图的价值,以便我可以更新现有的订单。希望你能理解我的问题,下面是我的代码:

  <div class="col-md-2">
                @Html.TextBoxFor(model => model.reference, new { placeholder = "Reference Number", required = "required", @class = "form-control form-group-margin" })
            </div>
<div id="loadpartial"></div>




  <script>
$(document).ready(function(){

    $("#reference").on("change", function () {
        var refer = $("#reference").val();
        $.post("/CRUD/CheckifOrderExists=" + refer, function (data) {
            $("#GetNumber").html(data);

        });
    });
});

现在是部分视图:

<table id="dtable" class="table-primary table-responsive col-md-7">
    <thead>
        <tr>
            <td id="orderHead">
                Description
            </td>
            <td id="orderHead">
                Country Name
            </td>
            <td id="orderHead">
                City Name
            </td>
            <td id="orderHead">
                Quantity
            </td>

        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td style="text-align:center">
                    @item.description
                </td>
                <td style="text-align:center">
                    @did.CountryName
                </td>
                <td style="text-align:center">
                    @itemd.cityName

                    

                      @item.quantity
                    </td>

                </tr>
            }
        </tbody>
    </table>


}

我想在主视图new div中从局部视图加载表格,以便我可以在现有参考编号下添加更多订单。

我知道在ajax调用之后我会像数据上的每个循环一样,但是dnt知道如何。

1 个答案:

答案 0 :(得分:0)

您可以使用AJAX get方法从视图中获取数据并将其附加到div中。

$(document).ready(function(){

    $("#reference").on("change", function () {
        var refer = $("#reference").val();
        $.post("/CRUD/CheckifOrderExists=" + refer, function (data) {
            $("#GetNumber").html(data);
            $.get("/partial_view_route", function (data) {
              $("#loadpartial").append(data);
            });    

        });
    });
});

在路由器文件中创建一个get路由,并在内部AJAX中替换该路由。