form表單發送請求方式

1，直接用表單的 action 屬性跳轉路由，此方法必須各節點的name屬性和 Java bean  實體類屬性相對應，並且onsubmit 屬性不為false。

優點：快速，簡單跳轉路由。

缺點：返回數據不好處理，前后台交互繁瑣。

 <form name="mdShopuser.form" action="/ShopUser/ShopUserGoin" method="POST" autocomplete="off" onsubmit="return validate()">
            <div class="info-name">
                <span>* 姓名</span>
                <input type="text"  name="mdShopuser.Name" value="" autofocus="autofocus" >
            </div>
            <div class="info-name">
                <span>* 手機號</span>
                <input type="text" value="" name="mdShopuser.Phone">
            </div>
            <div class="info-name">
                <span>* 店鋪名稱</span>
                <input type="text" value="" name="mdShopuser.ShopName">
                <div class="info-name">
                    <span>* 行業類別</span>
                    <input type="text" value="" name="mdShopuser.SalesPikd">
                </div>
                <div class="info-name">
                    <span>* 店鋪地址</span>
                    <input type="text" value="" name="mdShopuser.ShopAddress">
                </div>
                <div class="info-name">
                    <span>詳細地址</span>
                    <input type="text" value="" name="mdShopuser.DetailAddress">
                </div>
                <div class="reason">
                    <span>申請理由</span><br>
                    <textarea type="text" name="" rows="5" name="mdShopuser.Application"></textarea>
                </div>
                <div>
                    <button type="submit">提交申請</button>
                </div>
            </div>
        </form>

　2.　第二種方式是表單序列化提交  此方式onsubmit=false：就是不允許使用action，===》此方式使用點擊事件結合ajax 提交表單

優點：前后台交互方便，后台 給前台數據好處理。

缺點：需要結合ajax使用。

<form id="member_form" onsubmit="return false" method="POST">
    <div class="login-info login-name">
        <i class="fa fa-user-o"></i>
        <input type="text" value="" autofocus="autofocus" name="member.number_id" placeholder="請輸入賬號" id="input_username">
    </div>
    <div class="login-info login-pwd">
        <i class="fa fa-lock" aria-hidden="true"></i>
        <input type="password" value="" name="member.password" placeholder="請輸入密碼" id="input_password">
        <img src="/_view/_web/img/icon3.png" alt="" onclick="show()">
    </div>
    <div class="login-reg">
        <span><a href="/_view/_web/register/notMemberRegister.html">免費注冊</a></span>
    </div>
    <div class="login-btn">
        <button onclick="btn()">登錄</button>
    </div>
</form>

// 提交表單前驗證用戶名密碼不能為空
function btn() {
        $.ajax({
            type:"POST",
            dataType:"json",
            url:"/login/memberLogin",
            data:$("#member_form").serialize(),
            success:function (result) {
                console.log(result.status)
                if (result.status == "ok") {
                    window.location.href = "/login/tovip"
                }else if(result.status == "false"){
                    layer.msg("該賬號還未審核，暫時無法登錄",{time:1000})
                }else if (result.status == "false1"){
                    layer.msg("賬號或密碼錯誤",{time:1500})
                }
            },
            error:function (err) {
                layer.msg("賬號或密碼錯誤",{time:1000})
            }
        })
    }

}