当前位置:Gxlcms > PHP教程 > ExtJS与PHP、MySQL实现存储的方法

ExtJS与PHP、MySQL实现存储的方法

时间:2021-07-01 10:21:17 帮助过:28人阅读

1 建立数据库、注册表
代码如下:
  1. <br>create database db_register; <br>create table db_register.tb_register( <br>reg_loginid varchar(20) primary key, <br>reg_name varchar(20) not null, <br>reg_id int not null, <br>reg_password varchar(20) not null, <br>reg_sex varchar(2), <br>reg_address varchar(50) <br>); <br> <br><strong>2 建立register.php和save.php</strong> <br>register.php调用ExtJS文件 <br>save.php数据存储 <br>register.php=> <br><span><u></u></span> 代码如下:<pre class="brush:php;toolbar:false layui-box layui-code-view layui-code-notepad"><ol class="layui-code-ol"><li><br><html> <br><head> <br><title>注册</title> <br><link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css" /> <br><script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script> <br><script type="text/javascript" src="../ext/ext-all.js"></script> <br><script type="text/javascript" src="register.js"></script> <br></head> <br><body> <br></body> <br></html> <br> <br>save.php=> <br><span><u></u></span> 代码如下:<pre class="brush:php;toolbar:false layui-box layui-code-view layui-code-notepad"><ol class="layui-code-ol"><li><br><?php <br>if($_POST['password']!=$_POST['repassword']) <br>{ <br>//不执行存储 <br>exit; <br>} <br>$conn=mysql_connect("localhost","root","123"); <br>mysql_select_db("db_register"); <br>$sql="insert into tb_register(reg_loginid,reg_name,reg_id,reg_password,reg_sex,reg_address) <br>values('".$_POST['login']."','".$_POST['name']."','".$_POST['id']."','".$_POST['password']."','" <br>.$_POST['sex']."','".$_POST['address']."')"; <br>if(mysql_query($sql,$conn)) <br>{ <br>echo "注册成功"; <br>} <br>else <br>{ <br>echo "注册失败"; <br>} <br>mysql_close($conn); <br>?> <br> <br><strong>3 ExtJs文件register.js编写</strong> <br>register.js=> <br><span><u></u></span> 代码如下:<pre class="brush:php;toolbar:false layui-box layui-code-view layui-code-notepad"><ol class="layui-code-ol"><li><br>Ext.onReady(function() { <br>function registerhandler(){ <br>var values = Ext.getCmp("form").getForm().getValues(); //获取form里textfield、radio等值 <br>Ext.Ajax.request({ <br>url: 'save.php', <br>success: function() {Ext.Msg.alert("success");}, <br>method: "post", <br>failure: function(){Ext.Msg.alert("failure");}, <br>params: values <br>}); <br>} <br>var form = new Ext.form.FormPanel({ <br>id: 'form', <br>baseCls: 'x-plain', <br>layout:'absolute', <br>url:'save-form.php', <br>defaultType: 'textfield', <br>items: [{ <br>x: 0, <br>y: 0, <br>xtype:'label', <br>text: '登录帐户:' <br>},{ <br>x: 80, <br>y: 0, <br>name:'login', <br>anchor:'100%' <br>},{ <br>x: 0, <br>y: 30, <br>xtype:'label', <br>text: '用户姓名:' <br>},{ <br>x: 80, <br>y: 30, <br>name:'name', <br>anchor: '100%', <br>},{ <br>x:0, <br>y:60, <br>xtype:'label', <br>text:'身份证号:' <br>},{ <br>x:80, <br>y:60, <br>name:'id', <br>anchor:'100%', <br>},{ <br>x:0, <br>y:90, <br>xtype:'label', <br>text:'用户密码:' <br>},{ <br>x:80, <br>y:90, <br>inputType:'password', <br>name:'password', <br>anchor:'100%', <br>},{ <br>x:0, <br>y:120, <br>xtype:'label', <br>text:'密码确认:', <br>},{ <br>x:80, <br>y:120, <br>name:'repassword', <br>inputType:'password', <br>anchor:'100%', <br>},{ <br>x:80, <br>y:150, <br>xtype:'radio', <br>name:'sex', <br>fieldLabel:'性别', <br>boxLabel:'男', <br>inputValue:'b' //radio的取值为:b <br>},{ <br>x:0, <br>y:152, <br>xtype:'label', <br>text:'性别:' <br>},{ <br>x:140, <br>y:150, <br>xtype:'radio', <br>name:'sex', <br>fieldLabel:'性别', <br>boxLabel:'女', <br>inputValue:'g' //radio的取值为:g <br>},{ <br>x:0, <br>y:180, <br>xtype:'label', <br>text:'用户住址' <br>},{ <br>x:80, <br>y:180, <br>name:'address', <br>anchor:'100%' <br>}] <br>}); <br>var window = new Ext.Window({ <br>title: '注册帐户', <br>width: 400, <br>height:300, <br>minWidth:400, <br>minHeight: 300, <br>layout: 'fit', <br>plain:true, <br>bodyStyle:'padding:5px;', <br>buttonAlign:'center', <br>items: form, <br>buttons: [{ <br>text: '注册', <br>handler:registerhandler <br>},{ <br>text: '取消' <br>}] <br>}); <br>window.show(); <br>}); <br> <br><strong>4 运行http://localhost/register/register.php</strong> <br></li><li><p><img height="318" alt="" src="https://img.gxlcms.com//Uploads-s/new/2019-09-10-201910/20100402001257955.jpg" width="409"> </p></li><li><p><strong>5 输入相关信息,点击‘注册'</strong></p></li><li><p><img height="309" alt="" src="https://img.gxlcms.com//Uploads-s/new/2019-09-10-201910/20100402001258192.jpg" width="409"> <br></p></li><li><p><strong>6 Post方面</strong><br></p></li><li><p><img height="607" alt="" src="https://img.gxlcms.com//Uploads-s/new/2019-09-10-201910/20100402001258225.jpg" width="833"><br></p></li><li><p><strong>7 数据库方面</strong></p></li><li><p><img height="58" alt="" src="https://img.gxlcms.com//Uploads-s/new/2019-09-10-201910/20100402001258936.jpg" width="656"> <br><strong>8 总结 <br></strong><br>Ext.Window <br>buttons的handler <br>radio的取值inputValue <br><span><u></u></span> 代码如下:</p><pre class="brush:php;toolbar:false layui-box layui-code-view layui-code-notepad"><ol class="layui-code-ol"><li><br>Ext.Ajax.request({ <br>url: <br>success: <br>method: <br>failure: <br>params: <br><br>}); <br> <br>Ext.getCmp().getForm().getValues(); <br>平台:ExtJS+PHP Eclipse+Apache+MySQLadmin+firebug<p></p></li><li> </li><li> </li></ol></pre></li></ol></pre></li></ol></pre></li></ol></pre>

人气教程排行