如何通过ajax jquery将列表字符串从视图传递到控制器

Posted 2023-05-09

【中文标题】如何通过ajax jquery将列表字符串从视图传递到控制器

【英文标题】：how to pass list string from view to controller by ajax jquery

【发布时间】：2015-01-11 21:45:22

【问题描述】：

这是我的html

<ul class="sb_dropdown" style="display:none;">
                    <li class="sb_filter">Chon the loai</li>
                    <li><input type="checkbox" value="All"/><label for="all"><strong>Tất cả</strong></label></li>
                    <li><input type="checkbox" value="Woman"/><label for="Automotive">Đồ nữ</label></li>
                    <li><input type="checkbox" value="Shoes"/><label for="Baby">Giày</label></li>
                    <li><input type="checkbox" value="Bag"/><label for="Beauty">Túi sách</label></li>
                    <li><input type="checkbox" value="Man"/><label for="Books">Đồ nam</label></li>                      
                </ul>

这是我调用控件的ajax，

 <script>
                        $('.sb_search').click(function () 
                            var list = [];
                            $('ul.sb_dropdown').find("input:checkbox:checked").each(function () 
                                list.push($(this).val());
                            );
                            var key =  listkey: list ;
                            $.ajax(
                                url: '@Url.Action("Search", "Result")',
                                traditional: true,
                                data: list,
                                dataType: "html",
                                type: 'POST',
                                success: function (data) 
                                    alert("success");
                                ,
                                error: function () 
                                    alert("fail");
                                
                            );

                        );
                    </script>

在我的控制器中，我有一个参数列表键，我希望当我单击按钮搜索时会从视图中收到它

public ActionResult Result()
    
        return View();
    
    [HttpPost]
    public ActionResult Result(List<string> listkey)
    
        var n = listkey;
        return View();
    

当我调试这不是执行操作结果时，它会警告失败。告诉我我做错了什么。请帮助我了解 returnjson 为什么我需要使用而不是我想使用普通视图来显示我的结果

我已经解决了这个问题，因为我在我的 ajax 中放置了错误的操作和控制器。谢谢大家

【问题讨论】：

为什么要将 html 传递给action result？相反，您只能传递 selected/un-selected 的值。

我不想将我的 html 传递给操作结果，我想传递选中的复选框的列表值，并且我想在搜索控制器中打开结果视图

【参考方案1】：

编辑试试这个，创建数组并将它传递给你的控制器

    var stringArray = new Array();
    stringArray[0] = "item1";
    stringArray[1] = "item2";
    stringArray[2] = "item3";
    var postData =  listkey: stringArray ;

比你的数据在你的ajax调用中

   data: postData 


$.ajax(
        type: "POST",
        url: '@Url.Action("Search", "Result")',
        data: postData,
        success: function(data)
            alert(data.Result);
        ,
        dataType: "json",
        traditional: true
    );

---

你可以这样做，

将您的列表转换为json字符串，如下所示

您的数据将是data: ' "listkey":' + JSON.stringify(list) + '',

$.ajax(
                                url: '@Url.Action("Search", "Result")',
                                traditional: true,
                                 data: ' "listkey":' + JSON.stringify(list) + '',
                                dataType: "html",
                                type: 'POST',
                                success: function (data) 
                                    alert("success");
                                ,
                                error: function () 
                                    alert("fail");
                                
                            );

试试看你是否得到了你想要的结果

  [HttpPost]
        public ActionResult Result(List<string> listkey)
        
            var n = listkey;
            return View();
        

【讨论】：

调试时它没有将参数列表键传递给我的控制器，我认为当我使用 ajax 调用操作并将参数传递给它时我是正确的。我没有看到此代码有任何错误跨度>

你能帮帮我吗

嗨 prana，我试试这个，但它不起作用。所以我在布局页面中这样做，我试图轻松地将参数更改为 int id，然后我将它的值传递为 1，它警报失败

@CongLe - 如果可以帮助您解决问题，请接受答案

【参考方案2】：

<script>
 $('.sb_search').click(function () 
    var list = [];
    $('ul.sb_dropdown').find("input:checkbox:checked").each(function () 
    list.push($(this).val());
    );

    $.ajax(
        url: '@Url.Action("Search", "Result")',
        data:  listkey: list ,
        dataType: "json",
        type: 'POST',
        traditional: true,
        success: function (data) 
            alert("success");
        ,
        error: function () 
            alert("fail");
        
    );
);
 </script>



       [HttpPost]
       public ActionResult Result(List<string> listkey)
       
           var n = listkey;
           return View();