ExtJS與PHP、MySQL實現(xiàn)存儲的方法
更新時間：2010年04月02日 00:12:59 作者：
ExtJS與PHP、MySQL實現(xiàn)存儲的方法，需要的朋友可以參考下，里面有詳細的步驟。
1 建立數(shù)據(jù)庫、注冊表
create database db_register;
create table db_register.tb_register(
reg_loginid varchar(20) primary key,
reg_name varchar(20) not null,
reg_id int not null,
reg_password varchar(20) not null,
reg_sex varchar(2),
reg_address varchar(50)
);
2 建立register.php和save.php
register.php調(diào)用ExtJS文件
save.php數(shù)據(jù)存儲
register.php=>
<html>
<head>
<title>注冊</title>
<link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css" />
<script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext/ext-all.js"></script>
<script type="text/javascript" src="register.js"></script>
</head>
<body>
</body>
</html>
save.php=>
<?php
if($_POST['password']!=$_POST['repassword'])
{
//不執(zhí)行存儲
exit;
}
$conn=mysql_connect("localhost","root","123");
mysql_select_db("db_register");
$sql="insert into tb_register(reg_loginid,reg_name,reg_id,reg_password,reg_sex,reg_address)
values('".$_POST['login']."','".$_POST['name']."','".$_POST['id']."','".$_POST['password']."','"
.$_POST['sex']."','".$_POST['address']."')";
if(mysql_query($sql,$conn))
{
echo "注冊成功";
}
else
{
echo "注冊失敗";
}
mysql_close($conn);
?>
3 ExtJs文件register.js編寫
register.js=>
Ext.onReady(function() {
function registerhandler(){
var values = Ext.getCmp("form").getForm().getValues(); //獲取form里textfield、radio等值
Ext.Ajax.request({
url: 'save.php',
success: function() {Ext.Msg.alert("success");},
method: "post",
failure: function(){Ext.Msg.alert("failure");},
params: values
});
}
var form = new Ext.form.FormPanel({
id: 'form',
baseCls: 'x-plain',
layout:'absolute',
url:'save-form.php',
defaultType: 'textfield',
items: [{
x: 0,
y: 0,
xtype:'label',
text: '登錄帳戶:'
},{
x: 80,
y: 0,
name:'login',
anchor:'100%'
},{
x: 0,
y: 30,
xtype:'label',
text: '用戶姓名:'
},{
x: 80,
y: 30,
name:'name',
anchor: '100%',
},{
x:0,
y:60,
xtype:'label',
text:'身份證號:'
},{
x:80,
y:60,
name:'id',
anchor:'100%',
},{
x:0,
y:90,
xtype:'label',
text:'用戶密碼:'
},{
x:80,
y:90,
inputType:'password',
name:'password',
anchor:'100%',
},{
x:0,
y:120,
xtype:'label',
text:'密碼確認:',
},{
x:80,
y:120,
name:'repassword',
inputType:'password',
anchor:'100%',
},{
x:80,
y:150,
xtype:'radio',
name:'sex',
fieldLabel:'性別',
boxLabel:'男',
inputValue:'b' //radio的取值為:b
},{
x:0,
y:152,
xtype:'label',
text:'性別:'
},{
x:140,
y:150,
xtype:'radio',
name:'sex',
fieldLabel:'性別',
boxLabel:'女',
inputValue:'g' //radio的取值為:g
},{
x:0,
y:180,
xtype:'label',
text:'用戶住址'
},{
x:80,
y:180,
name:'address',
anchor:'100%'
}]
});
var window = new Ext.Window({
title: '注冊帳戶',
width: 400,
height:300,
minWidth:400,
minHeight: 300,
layout: 'fit',
plain:true,
bodyStyle:'padding:5px;',
buttonAlign:'center',
items: form,
buttons: [{
text: '注冊',
handler:registerhandler
},{
text: '取消'
}]
});
window.show();
});
4 運行http://localhost/register/register.php
Ext.Ajax.request({
url:
success:
method:
failure:
params:
});
Ext.getCmp().getForm().getValues();
平臺：ExtJS+PHP Eclipse+Apache+MySQLadmin+firebug
復(fù)制代碼 代碼如下:
create database db_register;
create table db_register.tb_register(
reg_loginid varchar(20) primary key,
reg_name varchar(20) not null,
reg_id int not null,
reg_password varchar(20) not null,
reg_sex varchar(2),
reg_address varchar(50)
);
2 建立register.php和save.php
register.php調(diào)用ExtJS文件
save.php數(shù)據(jù)存儲
register.php=>
復(fù)制代碼 代碼如下:
<html>
<head>
<title>注冊</title>
<link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css" />
<script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext/ext-all.js"></script>
<script type="text/javascript" src="register.js"></script>
</head>
<body>
</body>
</html>
save.php=>
復(fù)制代碼 代碼如下:
<?php
if($_POST['password']!=$_POST['repassword'])
{
//不執(zhí)行存儲
exit;
}
$conn=mysql_connect("localhost","root","123");
mysql_select_db("db_register");
$sql="insert into tb_register(reg_loginid,reg_name,reg_id,reg_password,reg_sex,reg_address)
values('".$_POST['login']."','".$_POST['name']."','".$_POST['id']."','".$_POST['password']."','"
.$_POST['sex']."','".$_POST['address']."')";
if(mysql_query($sql,$conn))
{
echo "注冊成功";
}
else
{
echo "注冊失敗";
}
mysql_close($conn);
?>
3 ExtJs文件register.js編寫
register.js=>
復(fù)制代碼 代碼如下:
Ext.onReady(function() {
function registerhandler(){
var values = Ext.getCmp("form").getForm().getValues(); //獲取form里textfield、radio等值
Ext.Ajax.request({
url: 'save.php',
success: function() {Ext.Msg.alert("success");},
method: "post",
failure: function(){Ext.Msg.alert("failure");},
params: values
});
}
var form = new Ext.form.FormPanel({
id: 'form',
baseCls: 'x-plain',
layout:'absolute',
url:'save-form.php',
defaultType: 'textfield',
items: [{
x: 0,
y: 0,
xtype:'label',
text: '登錄帳戶:'
},{
x: 80,
y: 0,
name:'login',
anchor:'100%'
},{
x: 0,
y: 30,
xtype:'label',
text: '用戶姓名:'
},{
x: 80,
y: 30,
name:'name',
anchor: '100%',
},{
x:0,
y:60,
xtype:'label',
text:'身份證號:'
},{
x:80,
y:60,
name:'id',
anchor:'100%',
},{
x:0,
y:90,
xtype:'label',
text:'用戶密碼:'
},{
x:80,
y:90,
inputType:'password',
name:'password',
anchor:'100%',
},{
x:0,
y:120,
xtype:'label',
text:'密碼確認:',
},{
x:80,
y:120,
name:'repassword',
inputType:'password',
anchor:'100%',
},{
x:80,
y:150,
xtype:'radio',
name:'sex',
fieldLabel:'性別',
boxLabel:'男',
inputValue:'b' //radio的取值為:b
},{
x:0,
y:152,
xtype:'label',
text:'性別:'
},{
x:140,
y:150,
xtype:'radio',
name:'sex',
fieldLabel:'性別',
boxLabel:'女',
inputValue:'g' //radio的取值為:g
},{
x:0,
y:180,
xtype:'label',
text:'用戶住址'
},{
x:80,
y:180,
name:'address',
anchor:'100%'
}]
});
var window = new Ext.Window({
title: '注冊帳戶',
width: 400,
height:300,
minWidth:400,
minHeight: 300,
layout: 'fit',
plain:true,
bodyStyle:'padding:5px;',
buttonAlign:'center',
items: form,
buttons: [{
text: '注冊',
handler:registerhandler
},{
text: '取消'
}]
});
window.show();
});
4 運行http://localhost/register/register.php
5 輸入相關(guān)信息，點擊‘注冊'
6 Post方面
7 數(shù)據(jù)庫方面
8 總結(jié)
Ext.Window
buttons的handler
radio的取值inputValue
復(fù)制代碼 代碼如下:
Ext.Ajax.request({
url:
success:
method:
failure:
params:
});
Ext.getCmp().getForm().getValues();
平臺：ExtJS+PHP Eclipse+Apache+MySQLadmin+firebug
您可能感興趣的文章:
- javascript Ext JS 狀態(tài)默認存儲時間
- javascript js cookie的存儲,獲取和刪除
- Node.js中調(diào)用mysql存儲過程示例
- 什么是cookie?js手動創(chuàng)建和存儲cookie
- js瀏覽器本地存儲store.js介紹及應(yīng)用
- jsp使用cookie存儲中文示例分享
- 用JavaScript計算在UTF-8下存儲字符串占用字節(jié)數(shù)
- JavaScript筆記之?dāng)?shù)據(jù)屬性和存儲器屬性
- JSON復(fù)雜數(shù)據(jù)處理之Json樹形結(jié)構(gòu)數(shù)據(jù)轉(zhuǎn)Java對象并存儲到數(shù)據(jù)庫的實現(xiàn)
- js仿微博實現(xiàn)統(tǒng)計字符和本地存儲功能
- 瀏覽器中url存儲的JavaScript實現(xiàn)
- JavaScript實現(xiàn)基于Cookie的存儲類實例
- 總結(jié)JavaScript三種數(shù)據(jù)存儲方式之間的區(qū)別
相關(guān)文章
關(guān)于PHP二進制流 逐bit的低位在前算法(詳解)
本篇文章是對PHP二進制流逐bit的低位在前算法進行了詳細的分析介紹，需要的朋友參考下2013-06-06
PHP中實現(xiàn)接收多個name相同但Value不相同表單數(shù)據(jù)實例
這篇文章主要介紹了PHP中實現(xiàn)接收多個name相同但Value不相同表單數(shù)據(jù)實例,需要的朋友可以參考下2015-02-02
這篇文章主要介紹了PHP數(shù)組操作類,涉及php針對數(shù)組的刪除、轉(zhuǎn)換、分組、排序等相關(guān)操作技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07
PHP使用pcntl_fork實現(xiàn)多進程下載圖片的方法
這篇文章主要介紹了PHP使用pcntl_fork實現(xiàn)多進程下載圖片的方法,較為詳細的分析了pcntl_fork的原理與用法,以及使用pcntl_fork實現(xiàn)多進程下載圖片的方法,非常具有實用價值,需要的朋友可以參考下
2014-12-12 
這篇文章主要介紹了php微信公眾開發(fā)之獲取周邊酒店信息的方法,涉及針對微信公眾平臺關(guān)于地理信息的應(yīng)用技巧,具有一定的參考借鑒價值,需要的朋友可以參考下
2014-12-12 
你應(yīng)該知道的PHP+MySQL分頁那點事，這篇文章主要為大家詳細介紹了PHP+MySQL分頁技術(shù)，為大家提供了完整php分頁實例，感興趣的小伙伴們可以參考一下
2016-08-08 
php實現(xiàn)通過stomp協(xié)議連接ActiveMQ操作示例
這篇文章主要介紹了php實現(xiàn)通過stomp協(xié)議連接ActiveMQ操作,結(jié)合實例形式分析了stomp擴展安裝及使用stomp擴展連接ActiveMQ具體操作技巧,需要的朋友可以參考下
2020-02-02 
這篇文章主要給大家介紹了PHP排序函數(shù)的使用方法,文章通過代碼示例介紹的非常詳細,PHP排序函數(shù)的使用方法,需要的朋友可以參考下
2023-09-09 
Php output buffering緩存及程序緩存深入解析
在php中有時為了控制程序的輸出顯示順序，提供了output buffering緩存(php自身緩存機制)。若Ob緩存開啟，需要輸出的就先存在ob緩存里，再到程序緩存里。若沒有開啟，則直接進入程序緩存，程序執(zhí)行完畢，按照順序從程序緩存里輸出
2013-07-07