MVC 3 应用程序中的自动数据加载

Question

好的，我有一个页面，其中使用 jquery/ajax 加载函数从下拉列表动态加载数据。一旦下拉选择发生更改，这允许部分视图动态加载并显示包含所有数据的网格。

这样做的问题是，当页面第一次加载时，数据被加载，这意味着没有 id 选择被发送到 jquery 加载函数。我尝试通过为下拉列表本身添加加载函数来解决此问题，因此当加载它时，它将重新加载数据视图，但无济于事。我认为这是因为控件在数据加载之前加载。但我不知道该怎么办。这是我到目前为止的代码。

<script>
$(document).ready(function () {
     $.ajax({
            type: 'GET',
            url: '@Url.Action("SessionsPartial", "Sessions")',
            data: 'id=' + $("#ScheduleTypeId").value,
            success: function (data) {
                $('#SessionData').fadeOut().html(data).fadeIn();
            }
        });
     $(function () {
    $("#ScheduleTypeId").change(function () {
        $.ajax({
            type: 'GET',
            url: '@Url.Action("SessionsPartial", "Sessions")',
            data: 'id=' + this.value,
            success: function (data) {
                $('#SessionData').fadeOut().html(data).fadeIn();
            }
        });
    });
          });

    $(function() {
        $("#ScheduleTypeId").load(function() {
            $.ajax({
                    type: 'GET',
                    url: '@Url.Action("SessionsPartial", "Sessions")',
                    data: 'id=' + this.value,
                    success: function(data) {
                        $('#SessionData').fadeOut().html(data).fadeIn();
                    }
                });
        });
    });
 });

正如我所说，最后一部分负载部分是我刚刚添加的，因此请随意批评。

Answer 1

第一次加载页面时，您实际上不需要执行 AJAX 调用来加载数据。您可以简单地包含包含 grid: 的部分

<div id="SessionData">
    @Html.Partial("SessionsPartial")
</div>

，然后仅订阅下拉列表的 .change() 事件来刷新部分：

<script type="text/javascript">
$(function () {
    $('#ScheduleTypeId').change(function () {
        $.ajax({
            type: 'GET',
            url: '@Url.Action("SessionsPartial", "Sessions")',
            cache: false,
            data: { id: $(this).val() },
            success: function (data) {
                $('#SessionData').fadeOut().html(data).fadeIn();
            }
        });
    });
});
</script>

Answer 2

问题是 ajax 函数确实调用了将数据加载到局部中的操作函数，但它在初始加载时发送模型的 id，而不是下拉列表的 id，因此数据加载为空。

我通过检查该值是否为 0 然后强制它加载无论如何都会是第一个的项目的 id 来解决这个问题。就像魅力一样。