Gửi nhiều mục tới bộ điều khiển MVC qua jQuery.Ajax

Question

Nếu bạn đang tuần tự hóa một biểu mẫu bằng cách sử dụng một cái gì đó như jQuery, nó sẽ thường ánh xạ các khóa và giá trị JSON tới các thuộc tính của một đối tượng trên Controller Action mà bạn đang đăng lên. Vì vậy:

jQuery:

function PostForm() { 
    $.ajax({ 
     url: "/Home/TestMVC", 
     type: "POST", 
     dataType: "application/JSON", 
     data: $('#form').serialize(), 
     complete: callFunction 
     } 
    }); 

Giả sử chi tiết chính chứa các yếu tố đó sẽ có tên của tham số như một chìa khóa họ nên lập bản đồ cho các đối tượng trực tiếp:

Hành động:

public void TestMVC(MyObject obj) 
{ 
//Obj should now contain the data from the serialised form 
} 

POST:

Name: "Bob" 
Age: "999" 
Sex: "Unknown" 

Có ai biết nó hoạt động như thế nào không? Mỗi lần tôi vượt qua biểu mẫu và mọi dữ liệu bổ sung cho bộ điều khiển.

Tôi muốn gửi nội dung của dữ liệu cũng như QueryString có thể chứa bất kỳ số lượng và loại cặp khóa/giá trị nào cho bộ điều khiển. Tôi có thể trích xuất các cặp khóa/giá trị này trên máy chủ vì tôi không thể tạo một đối tượng cho chúng trên chữ ký phương thức. Tuy nhiên, điều này không hoạt động như dự định.

jQuery:

function PostForm() { 

    $.ajax({ 
     url: "/Home/TestMVC", 
     type: "POST", 
     dataType: "application/JSON", 
     data: 
     { 
      Obj: $('#form').serialize(), 
      TheWeirdQueryString: $('.additionalParams').serialize(), 
     } 
    }); 
}; 

Hành động:

public void TestMVC(MyObject obj, String TheWeirdQueryString) 
{ 
//Obj now does NOT contain the element, it is NULL. Whereas TheWeirdQueryString works fine. 
} 

bài viết:

Obj: name=bob&age=999&sex="unknown" 
TheWeirdQueryString: param1=1&param2=2 

Tôi nghĩ rằng đây là vì tôi đã thực sự tạo ra một đối tượng JSON như dữ liệu và thiết lập các thuộc tính vào tên của đối tượng.

Có sự khác biệt về giá trị POST xuất hiện trong Firebug. Khi tôi đăng đối tượng một mình, các giá trị POST là tất cả các khóa của đối tượng/biểu mẫu với các giá trị tương ứng của chúng. Trong ví dụ thứ hai có hai thuộc tính đơn giản, tên tôi đã cho chúng, mỗi tên chứa QueryString (Foo=1&Bar=2) và MVC không thể ánh xạ QueryString cho các thành viên của một đối tượng (hoặc vì vậy nó sẽ xuất hiện).

Có cách nào để làm việc giống như trong trường hợp đầu tiên, mà còn gửi thêm dữ liệu đến đối số thứ 2 về Hành động không? Tôi đoán nó là để thêm một tài sản phụ cho tất cả những cái hiện có được tạo ra khi jquery thực hiện tuần tự hóa của biểu mẫu.

Các POST Tôi thực sự muốn là:

Name: "Bob" 
Age: "999" 
Sex: "Unknown" 
TheWeirdQueryString: param1=1&param2=2 

Answer 1

tham số datatype trong phương pháp $ .ajax là loại phản ứng (các loại dữ liệu mà bạn đang mong đợi trở lại từ máy chủ), không yêu cầu.Hãy thử điều này thay vì:

function PostForm() { 
    $.ajax({ 
     url: "/Home/TestMVC", 
     type: "POST", 
     dataType: "application/JSON", 
     data: $('#form').serialize() + "&" + $('.additionalParams').serialize() 
    }); 
}; 

hay:

function PostForm() { 
    $.ajax({ 
     url: "/Home/TestMVC" + "?" + $('.additionalParams').serialize(), 
     type: "POST", 
     dataType: "application/JSON", 
     data: $('#form').serialize() 
    }); 
}; 

CẬP NHẬT:

Hãy thử điều này:

Bộ điều khiển:

public void TestMVC(MyObject obj, String[] TheWeirdQueryString) 
{ 
} 

Chủ đầu tư:

function PostForm() { 
    $.ajax({ 
     url: "/Home/TestMVC", 
     type: "POST", 
     dataType: "application/JSON", 
     data: $('#form').serialize() + "&" + $('.additionalParams').serialize() 
    }); 
}; 

nhưng trên máy khách bên params bổ sung của bạn phải nằm trong định dạng sau:

TheWeirdQueryString[0]=param1&TheWeirdQueryString[1]=param2&...&TheWeirdQueryString[n]=paramN 

nên $ ('. AdditionalParams') các yếu tố phải có "id" và/hoặc "tên" các thuộc tính như: TheWeirdQueryString [1], TheWeirdQueryString [2] ... TheWeirdQueryString [N]

Hope this helps

Answer 2

dữ liệu là một đối tượng

... 
data: { 
    x :$('#form').serialize(), 
    y:'something else' 
} 
... 

Answer 3

Một giải pháp khác nếu bạn muốn một cuốn từ điển các cặp/giá trị chính:

public void TestMVC(MyObject obj, IDictionary<string, object> TheWeirdQueryString) 
{ 
} 

Chủ đầu tư:.

function PostForm() { 
    $.ajax({ 
     url: "/Home/TestMVC", 
     type: "POST", 
     dataType: "application/JSON", 
     data: $('#form').serialize() + "&" + $('.additionalParams').serialize() 
    }); 
}; 

$ ('. AdditionalParams') serialize() định dạng:

TheWeirdQueryString[0].Key=param0&TheWeirdQueryString[0].Value=value0&TheWeirdQueryString[1].Key=param1&TheWeirdQueryString[1].Value=value1&...&TheWeirdQueryString[n].Key=paramN&TheWeirdQueryString[n].Value=valueN 

CẬP NHẬT:

Bạn cần một cái gì đó như thế này:

<input class="additionalParams" type="text" name="TheWeirdQueryString[0].Key" value="param0" /> 
<input class="additionalParams"type="text" name="TheWeirdQueryString[0].Value" value="value0" /> 
<!-- ... --> 
<input class="additionalParams"type="text" name="TheWeirdQueryString[n].Key" value="paramN" /> 
<input class="additionalParams"type="text" name="TheWeirdQueryString[n].Value" value="valueN" />