一、易居创建异步提交表单本文向您展示如何通过easyui提交一个表单(表格).我们创建一个带有姓名、电子邮件和电话字段的表单。通过使用easyui表单(表格)插件来改变表单(表格)为创建交互式、快速动态网页应用的网页开发技术表单(表格).表单(表格)提交所有字段到后台服务器,服务器处理和发送一些数据返回到前端页面。我们接收返回数据,并将它显示出来。
创建表单(表格)
div style=' padd :3 px 2px border-bottom :1 px solid # CCC ' Ajax Form/div Form id=' ff ' action=' Form 1 _ proc。PHP ' method=' post ' table tr TD name :/TD TD tdinput name=' name ' type=' text '/input/TD/tr TD email :/TD TD TD input name=' phone ' type=' text '/input/TD改变为埃阿斯表单
$('#ff ').表单({ success :函数(数据){ $)。信使。警报(‘信息’、数据、‘信息’);} });服务器端代码
表单1 _ proc。PHP $ name=$ _ POST[' name '];$ email=$ _ POST[' email '];$ phone=$ _ POST[' phone '];回显"您的姓名:美元姓名br/您的电子邮件:美元电子邮件br/您的电话:美元电话";二、易居表单验证将向您展示如何验证一个表单易居。框架提供一个validatebox插件来验证一个表单。在本教程中,我们将创建一个联系表单,并应用validatebox插件来验证表单。然后您可以根据自己的需求来调整这个表单。
创建表单(表格)
让我们创建一个简单的联系表单,带有姓名、电子邮件、主题和消息字段:
div style=' padd :3 px 2px border-bottom :1 px solid # CCC ' form Validation/div form id=' ff ' method=' post ' div label for=' name ' name :/label input class=' measuri-validate box ' type=' text ' name=' name ' required=' true '/input/div label for=' email ' email 3:/label input class=' measuri-validate box ' type=' text ' name=' email ' required=' email '输入类型='提交'值='提交'/div/表单我们添加一个样式名为easyui-validatebox到投入标记,所以投入标记将根据validType属性应用验证。当表单无效时阻止表单提交
当用户点击表单的使服从按钮时,如果表单是无效的,我们应该阻止表单提交。
$('#ff ').form({ url:'form3_proc.php ',OnSubmit : FuncTion(){ return $(this)).表单(“验证”);},成功:函数(数据){ $。信使。警报(‘信息’、数据、‘信息’);} });如果表单是无效的,将显示一个提示信息。
以上就会针对表单进行的讲解,包括如何创建异步提交表单、如何进行表单验证,希望这些都可以帮助到大家。