Question

我正在尝试进行ajax调用，该调用将加载新模型并根据当前加载的模型重新加载我的editorTemplates。

现在我创建了一个看起来像这样的HotelModel：

'default' => env('DB_CONNECTION', 'mysql'),

'connections' => [

    'sqlite' => [
        'driver'   => 'sqlite',
        'database' => storage_path('database.sqlite'),
        'prefix'   => '',
    ],

然后我创建了一些EditorTemplates： HotelsReservationModel.cshtml＆amp; Hotel.cshtml

现在，我有以下顺序：

Index.cshtml（调用HotelsModel）
HotelsReservationModel.cshtml（调用HotelsReservationModel）
Hotel.cshtml（致电酒店）

我试图传递一个新的酒店（型号），所以当用户点击搜索时，会发生ajax呼叫，有些人知道酒店应该出现。

我的ajax代码：

public class HotelsModel
{
    public List<HotelsReservationModel> HotelsReservation { get; set; }
    public bool SkipButton { get; set; }
}

public class HotelsReservationModel
{

    public string City { get; set; }
    public DateTime CheckIn { get; set; }
    public DateTime CheckOut { get; set; }
    public List<Hotel> Hotels { get; set; }

}

public class Hotel
{
    public string Name { get; set; }
    public int Rating { get; set; }
}

来自HotelsReservationModel.cshtml的代码

<script type="text/javascript">

$(function () {

    var res = {
        loader: $("<div />", { class: "loader" }),
    };

    $('#search').on('click', function () {
        $.ajax({
            type: 'GET',
            url: "@Url.Action("Find", "Hotel")",
            datatype: "html",
            beforeSend: function () {
                $("#group-panel-ajax").append(res.loader);
            },
            success: function (data) {
                $("#group-panel-ajax").find(res.loader).remove();
                $('#group-panel-ajax').html(data);
            }
        });
        return false;
    });
});

</script>

ActionResult查找方法

<div class="group-panel" id="group-panel-ajax">
    @Html.EditorFor(m => m.Hotels)
</div>

可以看到我做错了吗？

如果我运行＆＃34;返回PartialView（＆＃34;索引＆＃34;，模型）会加载一些内容..那么整个页面与模型的内容将被加载到div中。我想要的只是加载＆＃34; Hotel＆＃34; - ＆GT;带有新模型的Hotel.cshtml。

Answer 1

为我的问题找到了一个很好的解决方案。

诀窍是将数据包装在Jquery中并使用方法find并指向它应该重新创建的div。

第一个代码：

$('#group-panel-ajax').html(data);

最终代码：

 $('#group-panel-ajax').html($(data).find("#group-panel-ajax"));

使用ajax调用的新模型加载EditorTemplate - MVC项目

1 个答案: