easyui源码翻译1.32--Form(表单)
2014-01-01 00:13
465 查看
前言
使用$.fn.form.defaults重写默认值对象下载该插件翻译源码form提供了各种方法来操作执行表单字段,比如:ajax提交, load, clear等等。当提交表单的时候可以调用validate方法检查表单是否有效
源码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Basic Form - jQuery EasyUI Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="../../themes/icon.css"> <link rel="stylesheet" type="text/css" href="../demo.css"> <script type="text/javascript" src="../../jquery-1.8.0.min.js"></script> <script src="../../plugins2/jquery.parser.js"></script> <script src="../../plugins2/jquery.validatebox.js"></script> <script src="../../plugins2/jquery.linkbutton.js"></script> <script src="../../plugins2/jquery.panel.js"></script> <script src="../../plugins2/jquery.form.js"></script> </head> <body> <h2>Basic Form</h2> <div class="demo-info"> <div class="demo-tip icon-tip"></div> <div>Fill the form and submit it.</div> </div> <div style="margin:10px 0;"></div> <div class="easyui-panel" title="New Topic" style="width:400px"> <div style="padding:10px 0 10px 60px"> <form id="ff" method="post"> <table> <tr> <td>Name:</td> <td><input class="easyui-validatebox" type="text" name="name" data-options="required:true"></input></td> </tr> <tr> <td>Email:</td> <td><input class="easyui-validatebox" type="text" name="email" data-options="required:true,validType:'email'"></input></td> </tr> <tr> <td>Subject:</td> <td><input class="easyui-validatebox" type="text" name="subject" data-options="required:true"></input></td> </tr> <tr> <td>Message:</td> <td><textarea name="message" style="height:60px;"></textarea></td> </tr> <tr> <td>Language:</td> <td> <select class="easyui-combobox" name="language"><option value="ar">Arabic</option><option value="bg">Bulgarian</option><option value="ca">Catalan</option><option value="zh-cht">Chinese Traditional</option><option value="cs">Czech</option><option value="da">Danish</option><option value="nl">Dutch</option><option value="en" selected="selected">English</option><option value="et">Estonian</option><option value="fi">Finnish</option><option value="fr">French</option><option value="de">German</option><option value="el">Greek</option><option value="ht">Haitian Creole</option><option value="he">Hebrew</option><option value="hi">Hindi</option><option value="mww">Hmong Daw</option><option value="hu">Hungarian</option><option value="id">Indonesian</option><option value="it">Italian</option><option value="ja">Japanese</option><option value="ko">Korean</option><option value="lv">Latvian</option><option value="lt">Lithuanian</option><option value="no">Norwegian</option><option value="fa">Persian</option><option value="pl">Polish</option><option value="pt">Portuguese</option><option value="ro">Romanian</option><option value="ru">Russian</option><option value="sk">Slovak</option><option value="sl">Slovenian</option><option value="es">Spanish</option><option value="sv">Swedish</option><option value="th">Thai</option><option value="tr">Turkish</option><option value="uk">Ukrainian</option><option value="vi">Vietnamese</option></select> </td> </tr> </table> </form> </div> <div style="text-align:center;padding:5px"> <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()">Submit</a> <a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()">Clear</a> </div> </div> <script> function submitForm(){ $('#ff').form('submit'); } function clearForm(){ $('#ff').form('clear'); } </script> </body> </html>
View Code
插件效果
![](http://images.cnitblog.com/blog/353349/201401/01001231-93b1be5f41204c05981119278c55a8fc.png)
相关文章推荐
- easyui源码翻译1.32--EasyLoader(简单加载)
- easyui源码翻译1.32--Pagination(分页)
- easyui源码翻译1.32+API翻译全篇导航 (提供下载源码)
- easyui源码翻译1.32--ComboBox(下拉列表框)
- easyui源码翻译1.32---ProgressBar(进度条)
- easyui源码翻译1.32--Layout(布局)
- easyui源码翻译1.32--PropertyGrid(属性表格)
- Easyui1.32源码+API翻译全篇导航
- easyui源码翻译1.32--LinkButton(按钮)
- easyui源码翻译1.32--Resizable(调整大小)
- easyui源码翻译1.32--Window(窗口)
- easyui源码翻译1.32--SearchBox(搜索框)
- easyui源码翻译1.32--Dialog(对话框窗口)
- easyui源码翻译1.32--Slider(滑动条)
- easyui源码翻译1.32--ComboGrid(数据表格下拉框)
- easyui源码翻译1.32--MenuButton(菜单按钮)
- easyui源码翻译1.32--Messager(消息窗口)
- easyui源码翻译1.32--SplitButton(分割按钮)
- easyui源码翻译1.32--ComboTree(树形下拉框)
- easyui源码翻译1.32--NumberBox(数值输入框)