Question

管理控制器

public ViewResult Products()

public PartialViewResult AddProduct()

public JsonResult AutoComplete(string prefix)

查看

Product.cshtml

AddProduct.cshtml - Partial View

我正在主视图中的模态弹出窗口中加载部分视图（AddProduct.cshtml）。

在局部视图中，我有一个表单，我正在尝试在输入字段上添加jQuery UI自动完成功能，但它无效。

$(function() {
        $("#txtProductName").autocomplete({
            source: function(request, response) {
                $.ajax({
                    url: '/Admin/AutoComplete/',
                    data: "{ 'prefix': '" + request.term + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function(data) {
                        response($.map(data, function(item) {
                            return item;
                        }))
                    },
                    error: function(response) {
                        alert(response.responseText);
                    },
                    failure: function(response) {
                        alert(response.responseText);
                    }
                });
            },
            minLength: 1
        });
    });

我在部分视图页面中添加了这个jquery代码，当我尝试使用ajax保存表单数据时也无法正常工作

Answer 1

最后我能够自己解决这个问题。

这是我的控制器代码：

[HttpGet]
public ViewResult Products() - Listing all the products (used for main view)

[HttpGet]
public PartialViewResult AddProduct() - Add new product form (used for partial view)

[HttpPost]
public JsonResult AutoComplete(string prefix) - Fetching data from database for autocomplete

查看

Product.cshtml - Html for listing all the products (Main View) AddProduct.cshtml - Html for add new product form (Partial View)

所以我在_Layout.cshtml（共享视图）文件中添加了所有jQuery引用，在部分视图中，我在页面底部添加了以下jQuery代码

$("#txtProductName").autocomplete({ rest of the logic and ajax hit goes here... }); - used to show autocomplete suggestion when user types $("#AddNewProduct").on("submit", "#AddNewProductForm", function (e) { $.ajax({ rest of the logic goes here... }); }); - used to submit the form data

Jquery ui自动完成不在局部视图中工作

1 个答案: