使用sencha touch 2.0中的内置验证向服务器添加数据
app.js
Ext.require([
'Ext.form.Panel',
'Ext.form.FieldSet',
'Ext.field.Radio',
'Ext.field.Url',
'Ext.field.Email',
'Ext.field.TextArea',
'Ext.field.Password',
'Ext.field.Spinner'
]);
Ext.application({
name: 'MyApp',
icon: 'images/icon.png',
glossOnIcon: true,
phoneStartupScreen: 'images/phone_startup.png',
tabletStartupScreen: 'images/tablet_startup.png',
launch: function(){
Ext.define('User', {
extend: 'Ext.data.Model',
config: {
fields: [
'name',
'sex',
'password',
{name:'age', type:'int'},
'email',
'url',
'memo'
],
validations: [
{
type: 'presence',
field: 'name',
message: '姓名必须输入'
},
{
type: 'exclusion',
field: 'test',
list: ['admin', 'administrator', '管理员'],
message: '不能使用这个姓名'
},
{
type: 'inclusion', field: 'sex',
list: ['male', 'female'],
message: '必须选择性别'
},
{
type: 'presence',
field: 'password',
message: '密码必须输入'
},
{
type: 'length',
field: 'password',
min: 7,
message: '密码长度必须超过6位'
},
{
type: 'length',
field: 'age',
max: 2,
message: '必须输入有效的年龄'
},
{
type: 'format',
field: 'age',
matcher: /^\+?[1-9][0-9]$/,
message: '必须输入有效的年龄'
},
{
type: 'email',
field: 'email',
message: '必须输入有效的email地址'
},
{
type: 'format',
field: 'url',
matcher: /^http:\/\/([\w-]+\.)+[\w-]+(\/[\w-./?%&=]*)?$/,
message: '必须输入有效的网址'
}
]
}
});
var formPanel = Ext.create('Ext.form.Panel', {
id: 'formPanel',
scrollable: 'vertical',
url: 'postUser.php',
items: [{
xtype: 'fieldset',
title: '注册信息',
instructions: '请填入您的注册信息',
defaults:{
labelwidth:'20%'
},
items: [{
xtype: 'textfield',
name: 'name',
label: '姓名',
placeHolder: '请输入您的姓名',
required: true,
clearIcon: true
},
{
xtype: 'passwordfield',
name: 'password',
label: '密码',
placeHolder: '请输入您的密码',
required: true,
clearIcon: true
},
{
xtype: 'fieldset',
title: '性别',
defaults:{
labelwidth: '20%',
xtype: 'radiofield'
},
items: [{
name: 'sex',
label: '男',
value: 'male'
},
{
name: 'sex',
label: '女',
value: 'female'
}]
},
{
xtype: 'numberfield',
name: 'age',
label: '年龄',
placeHolder: '请输入年龄',
clearIcon: true
},
{
xtype: 'emailfield',
name: 'email',
label: 'email',
placeHolder: '请输入有效的email地址',
clearIcon: true
},
{
xtype: 'urlfield',
name: 'url',
label: '个人主页',
placeHolder: '请输入有效的网址',
clearIcon: true
},
{
xtype: 'textareafield',
name: 'memo',
label: '个人说明',
placeHolder: '请输入你的个人说明',
clearIcon: true
}]
},
{
xtype: 'panel',
layout: {
type: 'hbox',
pack: 'end'
},
defaults: {
xtype: 'button'
},
items: [{
xtype: 'button',
ui: 'action',
text: '注册',
handler: function(){
var model = Ext.create('User', formPanel.getValues());
var errors = model.validate();
if(errors.isValid()){
formPanel.submit({
success: function(form, result){
Ext.Msg.alert('注册成功！');
},
failure: function(form, result){
var message = "";
Ext.each(result.errors, function(rec, i){
message += rec.message + "<br/>";
});
Ext.Msg.alert("注册失败！" + message);
}
});
}else{
var message = "";
Ext.each(errors.items, function(rec){
message += rec.getMessage() + "<br/>";
});
Ext.Msg.alert("验证失败！" + message);
}
}
}]
}]
});
Ext.Viewport.add(formPanel);
}
});
用于处理数据的页面postUser.php：
<?php
$name = formatStr($_REQUEST['name']);
$password = $_REQUEST['password'];
$sex = $_REQUEST['sex'];
$age = $_REQUEST['age'];
$email = formatStr($_REQUEST['email']);
$url = formatStr($_REQUEST['url']);
$memo = formatStr($_REQUEST['memo']);
header('Content-Type: application/json');
$link = mysql_connect("localhost", "root", "");
mysql_select_db("myST");
mysql_query("SET NAMES UTF8");
$result = mysql_query("SELECT * FROM users WHERE name = '".$name."'", $link);
if(mysql_num_rows($result) > 0){
echo '{"success":false, "errors": [{"message": '.json_encode("该用户已经存在").'}]}';
}else{
$sql = "INSERT INTO users(name, password, sex, age, email, url, memo)"." VALUES('".$name."', '".$password."', '".$sex."', ".$age.", '".$email."', '".$url."', '".$memo."')";
if(mysql_query($sql)){
echo '{"success": true}';
}else{
echo '{"success":false, "errors": [{"message": '.json_encode("新增数据失败！").'}]}';
};
}
// 自定义方法
function formatStr($str){
return trim(str_replace("'", "''", $str));
}
?>