jquery自動將form表單封裝成json

 <form action="" method="post" id="tf">
        <table width="100%" cellspacing="0" cellpadding="0" border="0">
            <tr>
                <th>
                    姓名：
                </th>
                <td>
                    <input type="text" id="txtUserName" name="model.UserName" />
                </td>
                <th>
                    聯系手機：
                </th>
                <td>
                    <input type="text" name="model.Mobile" id="txtMobile" maxlength="11" />
                </td>
                <th>
                    密碼：
                </th>
                <td>
                    <input type="password" name="model.Pwd" id="txtPwd" maxlength="11" />
                </td>
            </tr>
            <tr>
                <td style="text-align: center;" colspan="2">
                    <input type="button" value="  提  交  " style="padding-top: 3px;" name="butsubmit"
                        id="butsubmit" />
                </td>
            </tr>
        </table>
        </form>

 

 //提示到服務器

$(function () {
            $("#butsubmit").click(function () {
                var data = $("#tf").serializeArray(); //自動將form表單封裝成json


                //                $.ajax({
                //                    type: "Post",   //訪問WebService使用Post方式請求
                //                    contentType: "application/json", //WebService 會返回Json類型
                //                    url: "/home/ratearticle", //調用WebService的地址和方法名稱組合 ---- WsURL/方法名
                //                    data: data,         //這里是要傳遞的參數，格式為 data: "{paraName:paraValue}",下面將會看到      
                //                    dataType: 'json',
                //                    success: function (result) {     //回調函數，result，返回值
                //                        alert(result.UserName + result.Mobile + result.Pwd);
                //                    }
                //                });

                $.post("/home/ratearticle", data, RateArticleSuccess, "json");
            });
        })

 

 //結果顯示

function RateArticleSuccess(result) {
            alert(result.UserName + result.Mobile + result.Pwd);
        }

 

 

action處理

public JsonResult ratearticle(UserInfo model)
        {
            return Json(model);
        }