asp.net-mvc - 如何使用 $.ajax 将多个数组传递给 ASP.NET MVC 操作？

Question

我想使用 jQuery $.ajax 将两组文本框的内容传递到 Controller 上的操作。到目前为止，我的代码如下(为了便于阅读，全部缩写):

在我的 html 中:

<div class="venue-holder">
    <input class="tb-venue" id="venue" name="venue" readonly="readonly" type="text" value="Esfahan" />
    <input class="oldVenue" id="oldvenue" name="oldvenue" type="hidden" value="Shiraz" />
    <input class="tb-venue" id="venue" name="venue" readonly="readonly" type="text" value="Tehran" />
    <input class="oldVenue" id="oldvenue" name="oldvenue" type="hidden" value="Tabriz" />
</div>

在我的 Controller 中:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult UpdateVenue(string[] venue, string[] oldvenue)
{
    // do some stuff... 
}

在我的 jQuery 中:

$('form#formUpdateVenue').submit(function(event) {
    event.preventDefault();
    var venue = $('input[name=venue]');
    var oldvenue = $('input[name=oldvenue]')
    $.ajax({
        url: '/Admin/UpdateVenue',
        type: 'POST',
        dataType: 'json',
        data: {venue: venue, oldvenue: oldvenue},
        success: alert()
    });

问题:

上面显示的 jquery 不起作用。当我提交网页“挂起”时，我的 Controller 上的操作不会被调用。

但是，如果我用以下任一内容替换 data: 部分，则一切正常:

data: venue,

或者:

data: old venue,

换句话说，我可以将一组文本框传递给我的操作，并通过调试确认我获得了包含正确值的字符串数组。

但是，当我尝试通过两者时，我收到错误。我已尝试以下所有方法均无效:

data: {venue: venue, oldvenue: oldvenue},
data: {venue, oldvenue},

如何传递两个数组？

已解决 - 根据 Darin 的输入更新了 jQuery

$('form#formUpdateVenue').submit(function(event) {
    event.preventDefault();
    var tb = $('input[name=venue]');
    var tbVenue = new Array();

    tb.each(function() {
        tbVenue.push($(this).val());
    });

    var tbOld = $('input[name=oldvenue]');
    var tbOldVenue = new Array();

    tbOld.each(function() {
        tbOldVenue.push($(this).val());
    });


    $.ajax({
        url: '/Admin/UpdateVenue',
        type: 'POST',
        dataType: 'json',
        data: { venue: tbVenue, oldvenue: tbOldVenue },
        traditional: true,
        success: alert('Ok')
    });
});

Answer 1

试试这个:

$.ajax({
    url: '/Admin/UpdateVenue',
    type: 'POST',
    dataType: 'json',
    data: { venue: [ 'elem1', 'elem2' ], oldvenue: [ 'elemA', 'elemB' ] },
    traditional: true,
    success: function(result) {
        alert('ok');
    }
});

请注意，venue 和 oldvenue 参数必须是数组，而不是您的情况中的字符串。您只需从返回单个字符串的输入字段的值复制它们。因此，如果你想要一个数组，你需要构造一个 JavaScript 数组对象。

另请注意 traditional: true 配置值，如果使用 jquery 1.4 及更高版本，则需要该值才能成功执行模型绑定(bind)。