自我总结和学习表单提交的几种方式 (二)

<form id="form" enctype="multipart/form-data">
    <label for="name">姓名：</label>
    <input type="text" id="name" data-bind="value:vm.name" /><br />
    <label for="address">住址：</label>
    <input type="text" id="address" data-bind="value:vm.address" /><br />
    <label for="tel">手机号：</label>
    <input type="text" id="tel" data-bind="value:vm.tel" /><br />
    <input type="submit" value="添加" />
</form>

    $("#form").submit(function () {
        var model = ko.mapping.toJS(vm.entity);
        $.ajax({
            url: '@Url.Action("AddCustomInfo")',
            type: this.method,
            dataType: "Json",
            data: { fileInfo: model },
            success: function (data) {
                if (data.result) {
                    layer.alert("添加成功！");
                    $("#myModal").modal("hide");//隐藏弹框
                }
            }
        });
        return false;//阻止表单提交
    });

    $("#form").submit(function () {
        $(this).ajaxSubmit(function () {
            //执行你想要的回调函数
        });
        return false;//阻止表单默认提交
    });
    //或是
    $("@form").ajaxForm(function () {
        //执行你想要的回调函数
    });

    $("#form").submit(function () {
        $(this).ajaxSubmit(options);
        return false;//阻止表单默认提交
    });
    //或者
    $("#form").ajaxForm(options);

    $("#add").click(function () {
        var formData = new FormData();
        formData.append("file", document.getElementById("file").files[0]);
        formData.append("name", vm.name());
        formData.append("address", vm.address());
        formData.append("tel", vm.tel());

        $.ajax({
            url: '@Url.Action("addCustomInfo")',
            type: 'Post',
            dataType: "Json",
            processData: false,
            contentType: false,
            data: formData,
            success: function (data) {
                if (data.result) {
                    layer.alert("添加成功！");
                    $("#myModal").modal("hide");//隐藏弹框
                }
            }
        });
    });