Question

我有一个编辑详细信息表单，在jquery ui对话框中显示为部分。我想将修改提交回数据库，但是我在使用MVC3编辑表单上使用的标准提交按钮时遇到了麻烦。我想提交更改，但仍保留在对话框中。

我在页面上放了一个调用jquery的按钮（下面）。我需要知道的是如何序列化我的模型（称为Models.User）并将其传递回控制器。

正如您所看到的，我已经拥有了大部分jquery - 我需要做的就是序列化和数据并发送它。我猜我需要使用Json，但我不是100％就如何把它带进去。

任何帮助表示赞赏..

<script type="text/javascript">
    $(document).ready(function(e) {
        $(function() {
            $("#quickButton1").live("click", function (e) {
                e.preventDefault();
                $.ajax({
                    url: "/Users/QuickEditSave/",
                    data: ({}),                  
                    success: function (data) {
                        uiDialog.close();
                    },
                    error: function(xhr, ajaxOptions, thrownError) {
                        alert(xhr.responseText);
                    }
                });
            });
        });
    });    
</script>

Answer 1

您必须将表单输入元素序列化为JSON对象，然后通过$.Ajax发送。

使用此插件序列化您的表单数据（此部分来自SO question）：

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

$(function() {
    $('form').submit(function() {
        $('#result').text(JSON.stringify($('form').serializeObject()));
        return false;
    });
});

然后发送：

   $.ajax({
         url: "/Users/QuickEditSave/",
         data: JSON.stringify($('form').serializeObject()),                  
         success: function (data) {
          uiDialog.close();
         },
         error: function(xhr, ajaxOptions, thrownError) {
            alert(xhr.responseText);
         }
    });

Answer 2

解决：

var formData = $("form").serialize();

data: formData,
type: "POST",

然后在我的控制器期望和对象：

public string QuickEditSave(newUser newuser)

将模型对象从部分ui对话框传回控制器

2 个答案: