Official Site: http://malsup.com/jquery/form/
Notices:
- If ajaxForm() or ajaxSubmit() not working:
Check if include jQuery twice - Disable browser validation:
Add “novalidate” in <form>
Form HTML:
1 2 3 4 5 |
<form id="register_form" name="register_form" action="<?=base_url()?>index.php/api/member/register" method="post" enctype="multipart/form-data" novalidate> Name: <input type="text" name="name" /> Comment: <textarea name="comment"></textarea> <input type="submit" value="Submit Comment" /> </form> |
Javascript:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 |
$(document).ready(function(){ form_funs.init(); }); var form_funs = { get_form: function(){ return $('#register_form'); }, init: function(){ var wrap = this; var $form = wrap.get_form(); var $select_field = $form.find('.file_field'); var $select_button = $form.find('.select_button'); wrap.init_form(); $select_button.on('click', function(e){ e.preventDefault(); $select_field.trigger('click'); }); }, init_form: function(){ var wrap = this; var $form = wrap.get_form(); var $submit_button = $form.find('.bt_submit'); $submit_button.on('click', function(e){ e.preventDefault(); $form.submit(); }); $form.submit(function() { $(this).ajaxSubmit({ beforeSubmit: function(arr, $form, options) { var result = wrap.validate(arr, $form); return result; }, data: { }, success: function(data, statusText, xhr, $form) { if(data.status == 'success'){ window.location.href = base_url + 'index.php/competition/upload'; }else{ alert(data.message); } }, error: function(){ alert("ERROR"); } }); return false; }); }, validate: function(arr, $form){ var wrap = this; for(var i = 0; i < arr.length; i++){ var obj = arr[i]; if(obj.type == 'textarea'){ var $e = $('#' + obj.name); if($e.hasClass('ckeditor') == true){ //arr[i].value = get_cke(obj.name); } } if(obj.required == true && (obj.value == null || obj.value == '')){ var $field = $('input[name="' + obj.name + '"]'); var label = $field.attr('title'); if(typeof label == 'undefined' || label == null){ alert('Please enter all fields.'); }else{ alert('Please enter ' + label); } $field.focus(); return false; } } if(wrap.validate_password() == false){ return false; } return true; }, validate_password: function(){ var wrap = this; var $form = wrap.get_form(); var $pw1 = $form.find('input[name="passwd"]'); var $pw2 = $form.find('input[name="confirm_passwd"]'); var length_limit = 5; if($pw1.val().length < length_limit){ alert('密碼長度至少要5個字元'); $pw1.focus(); return false; } if($pw1.val() != $pw2.val()){ alert('請確認輸入相同的密碼'); $pw2.focus(); return false; } return true; } } |