<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
< head>
;%@ include file="../extJs/CommonJs.jsp"%>
//Set the default number of rows displayed on each page to 10
var QUERY_PAGE_SIZE = 10;
/**
* Author: Hua Hui
* Time: December 22, 2009
* Content: Add, delete, modify and check operations commonly used in extJs
*/
function searchQueryForm()
{> // Form is recommended to be set to a local variable when used. You can get Form
var QueryForm = NULL;
QueryForm = New Ext. Formpanel ({
ID: 'queryform', // Specify the ID
renderto: 'searchpanel' of Queryform, // // point to the DIV layer where Form is
Labelwidth: 70, // Label label the width occupation page. The percentage of
region:'north',
border:false, //To display the border of the panel's body element, falsely hide it (default is true)
badyBorder:false, //Display the panel's body Elements, hypothesis to hide it (the internal boundary of the default TRUE)
Labelign: 'Right', // Label label alignment method
Frame: true, // The round boundary of the custom panel, the border width 1px 1px 1px .Default is false
🎜> through 🎜> items:[{
columnWidth:.5,
layout:'form',
items :{
xtype:'textfield',
fieldLabel:'user code',
maxLength:'50',
vtype:'specialChar',
anchor:'80%'
}
,{
columnWidth:.5,
layout:'form',
items:{
name:'userName',
hiddenName:'userName',
xtype:'textfield',
fieldLabel:'用户名称',
maxLength:'100',
vtype:'specialChar',
anchor:'80%'
}
}
]
}]
});
}
/**
* showUserForm(): Draw and add a form
*/
function showUserForm()
{
//Define variables as local variables to avoid generating a new object every time
var userForm = null; 'right',
border:false,
ms:[
items:{
name:'userInfo.userId',
hiddenName:'userInfo.userId', //hiddenName dynamically binds the corresponding field in the database
xtype:'textField', //xtype can Divided into three categories, textField is the control of the form field 🎜> BlankText: 'Fill in the user code', // Prompt message for empty text box maxLength:'50', //The maximum input allowed in the text box Length, minimum minLength
vtype:'specialChar',
anchor:'80%'
,{
columnWidth:'.8',
items:{
name:'userInfo.userName', hiddenName:'userInfo.userName',
A> FieldLabel: 'User name & lt; font color = red & gt;*& lt;/font & gt;',
labelseparator: '',
Blanktext: 'Fill in the user name',
a llowblank: false,
maxLength:'100', ; {
name: 'userInfo.pwd',
Hiddenname: 'userInfo.pwd',
XType: 'TextField',
Inputtype: 'Password',
Fie ldlabel: 'User Password & LT ;font color=red>*',
labelSeparator:'',
blankText:'Fill in user password',
allowBlank:false,
maxLength:'12',
minLength:'6',
value:'123456', //User default secret
anchor:'1 00%'
,{
columnWidth:'.8',
items:{
name:'rPwd',
HiddenName:'rPwd',
xtype:'textField',
inputType: 'password',
fieldLabel:'Confirm password*',
labelSeparator:'',
BlankText: 'Secrets entered twice must be the same',
allowBlank:false,
vtype:'pwdRange',
pwdRange:{begin:' userInfo.pwd',end:'rPwd'},
maxLength:'12',
anchor :'100%'
userForm = new Ext.FormPanel({
id:'editForm',
labelWidth:'80',
labelAlign:'right ',
border: false, false,
frame:true,
items:[
layout:'column',
items:[
{
columnWidth:'.8',
items:{
name:'userInfo.userId',
hiddenName:'userInfo.userId', //hiddenName dynamically binds the corresponding field in the database
xtype:'textField', //xtype can be divided into three Class, textField is the control of the form field readOnly:true, //The text box is read-only
disabled:true, // The text box is gray, different from other text box colors
MaxLength: '50 ', // The text box allows the maximum length of the input, the smallest minLength
// let the letter start, and only the letters and the number length of 2 to 12 can be existed
regex: /^[a-zA-Z]{1}([a-zA-Z0-9]|[_]){1,11}$/,
regexText: 'User code must start with a letter, Length 2-12 digits!',
anchor:'90%'
}
,{
columnWidth:'.8',
items:{
name:'userInfo.userName', hiddenName:'userInfo.userName',
A> FieldLabel: 'User Name',
LabelsePaator: ':',
Blanktext: 'Fill in the user name',
AllowBlank: False,
MaxLength: '100',
///> /// Contains only Chinese characters, numbers, letters, and underscores. It cannot start or end with an underscore
regex: /^(?!_)(?!.*?_$)[a-zA-Z0-9_u4e00-u9fa5] $/,
regexText: 'Contains only Chinese characters, numbers, letters, and underscores and cannot start and end with underscores!',
anchor:'90%'
} }
},{ :'.2',
items:{
hiddenName:"infoFill",
name:"infoFill",
xtype:'label',
html:'*',
labelSeparator:'',
anchor:'100%'
} }
,{
columnWidth:'.8',
items:{
name:'userInfo.pwd', hiddenName:'userInfo.pwd',
labelSeparator:':',
blankText:'Fill in user password' ,
allowBlank:false,
maxLength:'12',
minLength:'6',
anchor:'90%'
}
},{
columnWidth: '.2',
items:{
hiddenName:"infoFill",
name:"infoFill",
xtype:'label',
html:'',
labelSeparator:'',
anchor:'100%'
}
,{
columnWidth:'.8',
items:{
name:'rPwd',
HiddenName:'rPwd',
xtype:'textField',
inputType: 'password',
fieldLabel:'Confirm password*',
labelSeparator:':',
BlankText: 'Secrets entered twice must be the same' ,
allowBlank:false, // vtype is the verification method, if it is a general verification, please If it is a special case, you can use regex
vtype:'pwdRange',
maxLength:'12',
anchor:'90%'
}
columnWidth:'. 2',
items:{
hiddenName:"infoFill",
name:" infoFill",
xtype:'label',
html:'*',
labelSeparator:'',
anchor:'100%'
/**
* onReady: The file is ready (before onload and image loading)
**/
Ext.onReady(function(){
searchQueryForm();
//Get query form
var queryForm = Ext .getCmp("queryForm").getForm(); Defaluts:{ border:false,bodyBorder:false,activeTab:0},
items:[queryForm,{id:'centerPanel',region:'center',height:document.body.clientHeight,contentEl:'mainDiv'}]
}); /query information
var store = new Ext.data.Store({
url:'../user/doGetPageList.action', //action path
reader:new Ext.data.JsonReader({
root:'userList', //Parameters passed from struts2.0: User collection
totalProperty:'rowTotal', //Parameters passed from struts2.0: Total number of rows of information
through 🎜> });
**
* Layout set to border means the page will be divided into five parts, southeast, northwest, and middle
* This means the centerPanel is placed in the middle
*/
function getMsg()
{
}
/**
* callback: function called
**/
function submitForm() {
//Initialize grid
var grid = null;
//Checkbox
var sm = new Ext.grid.CheckboxSelectionModel({
dataIndex:'id',
width:'20 '
); The functionality of the cell's HTML tag. If not specified, the default renderer uses the raw data value.
> var colM = new Ext.grid.ColumnModel(
Name',dataIndex:'userName',align:'center',sortabel:true},
{header:'delete',dataIndex:'id',align:'center',renderer:function createButton(){
return '
';}},
{header:'edit',dataIndex:'userId',align:'center',renderer:function createButton(userId, metadata, record){ a style="cursor:hand" style="cursor:hand" onclick=updateForm(' userId ') >' record.get('userName') 'Information modification' '';}}]
);
// Get the query form
var Form = EXT.GETCMP ("QueryForm"). Getform ();
// determine whether to pass the verification , if not, please close it directly
🎜> /**
* getLimitCount() : Get the number of rows per page for paging. If no value is passed, the default value will be used. When, execute function getMsg.Can be omitted
*/
store.load({params:{start:0,limit:getLimitCount()}, callback:getMsg});
if(grid == null)
title:"User query results", //grid title
width:document.body.clientWidth, //Set the value of grid’s width
viewConfig:{forceFit:true}, // Set the full window of the number of columns Region:'center', //This is set in The position displayed in the ViewPort is
cm:colM, //The defined column
ds:store, //The defined data source
border:false,
bodyBorder:false,
, // The defined check box
// Listeners: Including one or more event handling procedures is added to this object's initialization process
Listeners: {cellclick: renderPage}},
🎜> xtype:'button', Select ', 🎜> through The default is: query_page_size
Store: Store,
Displayinfo: True,
Displaymsg: 'Display the record of {0} to the record of {1}. ; .
var userForm = Ext .getCmp("conditionForm").getForm();
null)
x:100, //Initialization x-direction position of the window
y:100, // . closeAction:"hide", //The default window is hidden
resizable: false, // The size of the window does not allow dragging, the default is true
. 🎜> buttons ; {
:'../user/addUser.action',
params:{roleId:userForm.form.findField('userId').getValue()}， waitMsg:'Save data, Please wait...', //Scroll bar prompt content
if(message == null){
Ext.Msg.alert("Prompt message", "User information added successfully!"); AddUserWin.hide();
Ext.Msg.alert("Message",message);
> Ext.Msg.alert('prompt message'," Failed to add new user!");
return; sg.alert("Prompt message", "There is an error in the form, please fill it in correctly!");
{handler:function(){addUserWin. hide();},text:'Close'}]
});
function delForm(userId)
( )
url:'../user/delUser.action',
params:{userId: userId},
method:'post',
success:function(o)
{
var info = Ext.decode(o.responseText); Prompt information", info.message);
. User information deletion failed!");
; > });
How to restore IE browser to automatically jump to EDGE
Virtual machine software
How to solve the problem that Ethernet cannot connect to the internet
vivox100s parameter configuration details
Yiou Exchange app official website download address
What format is doc?
How to be invisible online on TikTok
Detailed explanation of onbeforeunload event
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
