Question

当函数包含ajax调用时，不会触发下拉选择更改。如果该函数仅包含警报，则该函数可以正常工作。

以下是代码：

 <div class="col-md-6">
                    <div class="form-group">
                        <label>Select Category</label>
                        @Html.DropDownListFor(x => x.CategoryId, new SelectList(Model.Categories, "CategoryId", "CategoryName", Model.CategoryId),
                            new { @class = "form-control select2", id = "myCategories" })

                    </div>
                    <div class="form-group" id="makes">

                    </div>

                </div>

这是js函数

    @section scripts{

    <script type="text/javascript">

        $(document).ready(function () {
        $(document.body).on('change', "#myCategories", function (event) {
            var selected = $('#myCategories').val();
            alert("catid changed to : " + selected);
            $.ajax({
                url : @Url.Action("getMakes","Transaction", new {categoryId= Model.CategoryId}),
                success: function (data) {
                    alert(data);
                    $('#makes').html = data;
                },
                error: function () {
                    alert("failed");
                }
            });
        });
    });
    </script>
}

如果我评论ajax块，它可以工作并显示警报。有人知道为什么会这样吗？

Answer 1

感谢所有帮助我解决这个问题的人，即使它是圣诞节。最后我通过在ajax中的url部分之前和之后放置单个倒置逗号来实现它。感谢@AnilTalla提供的控制台线索。这是更新的js

$(document).ready(function () {
        $(document.body).on('change', "#myCategories", function (event) {
            var selected = $('#myCategories').val();
            alert("catid changed to : " + selected);
            $.ajax({
                url : '@Url.Action("getMakes","Transaction", new {categoryId= Model.CategoryId})',
                success: function (data) {
                    alert(data);
                    $('#makes').html = data;
                },
                error: function () {
                    alert("failed");
                }
            });
        });
    });

大家圣诞快乐。

Ajax调用选择更改不会触发

1 个答案: