Skygq表單驗證ajax無重新整理表單提交

來源:互聯網
上載者:User

1.對待input checkbox選擇的特殊需求,現在可以做到限制它的選擇個數,可以讓它只選擇幾個,或者選擇幾個到幾個之間。
2.對待input text文本域,可以設定輸入的值必須在一個區間之內。比如限定輸入的年齡在18歲到78歲。
3.新加了一個介面,可以添加驗證規則
介面執行個體如下:

 代碼如下 複製代碼

var rules = {
        "coupon_amount"         : [/^0.([1-9]){1,2}$/,"必須為0.85這樣的數字"]
}
$.skygqCheckAjaxForm.addRules(rules);

規則是索引值對的形式,“coupon_amount”代表的是驗證類型,也就是對應著type參數,後面的數組參數的第一個參數是 驗證規則,第二個參數是當表單的內容不符合這個驗證規則的時候,提示的資訊。
這個對應著的表單初始化資訊是這樣的:

 代碼如下 複製代碼

{ name:"zhekou",type:"coupon_amount",simple:"折扣",focusMsg:"請填寫折扣係數"}


4.表單域的名稱可以支援“[”、“]”、“.”這三種特殊符號

DEMO中的表單初始化用的js如下:

 代碼如下 複製代碼

$(function(){
    var rules = {
        "coupon_amount"         : [/^0.([1-9]){1,2}$/,"必須為0.85這樣的數字"]
    }
    $.skygqCheckAjaxForm.addRules(rules);
    //第二個表單驗證
    var items_array2 = [
        { name:"info[login]",type:"username",simple:"使用者名稱",message:"搞什麼飛機,好好填寫使用者名稱",focusMsg:'數字和英文及底線和.的組合,開頭為字母,4-20個字元',ajax:{method:'post',url: base_url+'skygq_check_ajax_form_1_5/ajax.html',success_msg:'恭喜!使用者名稱可用',failure_msg:'使用者名稱已存在'}},
        { name:"info[password]",type:'password',simple:"密碼",focusMsg:'最小長度:6 最大長度:16'},
        { name:"info[confirm_password]",type:'eq',to:'info[password]',simple:"確認密碼",focusMsg:'請再輸入一遍您上面填寫的密碼'},
        { name:"info[email]",type:"mail",simple:"Email",focusMsg:'請填寫真實並且最常用的郵箱'},
        { name:"info[age]",simple:"年齡",between:[18,78],focusMsg:'年齡必須大於等於18小於等於78'},
        { name:"info[do_years]",simple:"工作年限",type:"gt",value:3,focusMsg:'必須大於3'},
        { name:"sport[]",simple:"運動",checked_limit:[2,2],focusMsg:"請選擇2項運動"},
        { name:"favourite[]",simple:"愛好",checked_limit:[4,7],focusMsg:"請選擇4到7項愛好"},
        { name:"sky.zhekou",type:"coupon_amount",simple:"折扣",focusMsg:"請填寫折扣係數"}
    ];
 
    $("#form2").skygqCheckAjaxForm({
        items           : items_array2,
        isAjaxSubmit    : true,
        success         : showResponse2,
        dataType        : 'json'
    });
    function showResponse2(responseText, statusText, xhr, $form)  {
        alert("註冊成功")
        alert("JSON返回資料為:" + responseText);
    }
});

再給個DEMO下載吧。(PS:下載的DEMO示範,和夢三秋的線上DEMO示範是不一樣的,沒有ajax提交也沒有ajax驗證,只是簡單的一個前端驗證

http://file.111cn.net/upload/2013/09/ajax.rar

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.