簡體   English   中英

有一個JavaScript對象數組作為ajax調用參數,而沒有jquery?

[英]Having an array of javascript objects as an ajax call parameter, without jquery?

我正在嘗試不使用jQuery將JavaScript對象數組發送到ASP.Net MVC控制器。 我有一個簡單的JavaScript對象數組,像這樣...

var data = [];

data.push(new person(1, "David"));
data.push(new person(2, "Karine"));
data.push(new person(2, "Annie"));
...etc

function person(_id, _name) {
    this.id = _id;
    this.name = _name;
}

...而且我想像這樣將其作為ajax調用的參數:

var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {
                    var obj = JSON.parse(xmlhttp.responseText);
                        for (var i = 0; i < obj.length; i++) {                                                
                            if (i == 1) {
                                    alert(obj[i].name);}
                        }
                }
                else {
                    alert('There is an error');
                }
    }
};

xmlhttp.open("GET", "/Home/AjaxTester?id=15&name=dave", true);                             
xmlhttp.send();

到目前為止,我發現了將參數傳遞給ajax調用的方式,即...Home/AjaxTester?id=15&name=dave ,對於基本類型來說效果很好,但是我找不到找到更多方法來執行此操作的方法復雜”類型。 我願意采用新方法來參數化ajax調用(如果有更好的方法),甚至可以采用新方法進行ajax調用,只要它是純JavaScript,無庫,無框架等即可。

這是我的MVC控制器...

public JsonResult AjaxTester(List<Person> _person)
{
    //Whatever Logic...

    return Json(_someObjects);
}

...以及所接收參數的類別

public class Person
{
    public int id { get; set; } = 0;      
        public string name { get; set; } = "";

        public Person(int _id, string _name)
        {
            this.id = _id;
            this.name = _name;
        }
}

您需要在參數之前使用FromUri命令,如下所示:

public JsonResult AjaxTester(FromUri List<Person> _person)

您需要將http方法從GET更改為POST。

xmlhttp.open("POST", "/Home/AjaxTester?id=15&name=dave", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(JSON.stringify(data)); 

https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest/send

確保添加setRequestHeader。 如果要發送json對象,則將請求標頭更改為以下內容:

xhr.setRequestHeader("Content-type", "application/json");

我還建議刪除查詢參數並更新控制器以接受這種類型的對象。 您可能還需要在該參數旁邊添加[FromBody]。

並且您的控制器應該像

public JsonResult AjaxTester([FromBody] List<Person> _person)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM