<%@ page 언어="java" import="java.util.*" pageEncoding="UTF-8"%>
머리>
;%@ include file="../extJs/ CommonJs.jsp"%>
// 각 페이지에 표시되는 기본 행 수를 10으로 설정
var QUERY_PAGE_SIZE = 10;
/**
* 작성자: Hua Hui
* 시간: 2009년 12월 22일
* 내용: extJ에서 흔히 사용되는 추가, 삭제, 수정 및 확인 작업
*/
function searchQueryForm()
{> // 폼 사용 시 로컬 변수로 설정하는 것이 좋습니다 . Form
var QueryForm = NULL;
QueryForm = New Ext. Formpanel ({
ID: 'queryform', // ID 지정
renderto: 'searchpanel' Queryform, // // Form이
Labelwidth: 70인 DIV 레이어를 가리킵니다. // 너비 점유 페이지에 레이블을 지정합니다.
지역:'north',
border:false, / /패널의 몸체 요소의 테두리를 표시하려면 거짓으로 숨깁니다(기본값은 true)
badyBorder:false, //패널의 몸체 요소를 표시합니다. 이를 숨기겠다는 가설(기본값 TRUE의 내부 경계)
Labelign: 'Right', // 라벨 라벨 정렬 방법
Frame: true, // 커스텀 패널의 둥근 경계, 테두리 너비 1px 1px 1px .기본값은 false입니다
~ ~ 🎜> 항목을 통해:[{
> > fieldLabel:'사용자 코드',
maxLength:'50',
vtype:'specialChar',
앵커:'80%'
}
> > ',
fieldLabel:'용도명',
maxLength:'100',
> 🎜> ]
}]
});
}
/**
* showUserForm(): 양식 그리기 및 추가
*/
function showUserForm()
{
//매번 새 객체가 생성되는 것을 방지하려면 변수를 로컬 변수로 정의하세요.
var userForm = null ; '오른쪽',
테두리:false,
| ~ 항목:{
name:'userInfo.userId',
HiddenName:'userInfo.userId', //hiddenName 동적으로 데이터베이스의 해당 필드를 바인딩합니다
xtype:'textField', //xtype은 세 가지 범주로 나뉘며 textField는 양식 필드를 제어합니다. 🎜> ~ BlankText: '사용자 코드를 입력하세요.', // 프롬프트 메시지 빈 텍스트 상자 maxLength:'50', //텍스트 상자에 허용되는 최대 입력 길이, 최소 minLength
vtype:'specialChar',
앵커:'80%'
,{
열 너비:'.8',
항목:{
이름:'userInfo.userName', ~ HiddenName:'userInfo.userName',
A> FieldLabel: '사용자 이름 & lt; 글꼴 색상 = 빨간색 & gt;*& lt;/font & gt;',
labelseparator: '',
공백 텍스트: '사용자 이름을 입력하세요',
허용공백: false,
maxLength:'100', ~ ~
입력 유형: '비밀번호',
Fie ldlabel: '사용자 비밀번호 & LT ;font color=red>*',
labelSeparator:'',
BlankText:'사용자 비밀번호 입력',
allowedBlank:false,
maxLength:'12',
minLength:'6',
value:'123456', //사용자 기본 비밀
앵커:'1 00%'
,{
컬럼 너비:'.8',
항목:{
이름:'rPwd',
HiddenName:'rPwd',
xtype:'textField',
inputType: 'password',
fieldLabel:'비밀번호 확인
*',
labelSeparator:'',
BlankText: '두 번 입력한 비밀번호는 동일해야 합니다.',
allowedBlank:false,
vtype:'pwdRange',
pwdRange:{begin:' userInfo.pwd',end:'rPwd'},
maxLength:'12',
앵커: '100%'
userForm = new Ext.FormPanel({
id:'editForm',
labelWidth:'80',
labelAlign:'right ',
border: false, false,
프레임:true,
항목:[
레이아웃:'열',
항목:[
{
열 너비:'.8',
항목:{
name:'userInfo.userId',
HiddenName:'userInfo.userId', //hiddenName은 데이터베이스의 해당 필드를 동적으로 바인딩합니다.
xtype:'textField', //xtype은 세 가지 클래스로 나눌 수 있습니다. textField는 양식 필드의 제어입니다. readOnly:true, //텍스트 상자는 읽기 전용입니다
비활성화:true, // 텍스트 상자는 회색이며 다른 텍스트 상자 색상과 다릅니다.
MaxLength: '50 ' , // 텍스트 상자는 입력의 최대 길이, 가장 작은 minLength를 허용합니다
// 문자로 시작하고 2~12 사이의 문자와 숫자만 존재할 수 있습니다.
regex: /^[a-zA-Z]{1}([a-zA-Z0-9]|[_]){1,11}$/,
regexText: '사용자 코드는 문자, 길이로 시작해야 합니다 2~12자리!',
앵커:'90%'
}
,{
열 너비:'.8',
항목:{
이름:'userInfo.userName', ~ HiddenName:'userInfo.userName',
A> 필드 라벨: '사용자 이름',
LabelsePaator: ':',
공백 텍스트: 사용자 이름 입력 ',
AllowBlank: False,
MaxLength:' 100 ',
/// 한자, 숫자, 문자만 포함 , 밑줄로 시작하거나 끝날 수 없습니다.
정규 표현식: /^(?!_)(?!.*?_$)[a-zA-Z0-9_u4e00-u9fa5] $/,
RegEXText: '다음 줄은 한자, 숫자, 문자, 하위 줄만 시작하고 끝낼 수 없습니다!',
ANCHOR: '90%'
}
}, {
열 너비 :'.2',
항목:{
HiddenName:"infoFill",
이름:"infoFill",
xtype:'label',
html:'*',
labelSeparator:'',
앵커:'100%'
} }
,{
열 너비:'.8',
항목:{
이름:'userInfo.pwd', ~ > ~ inputType:'password',
> 🎜> 앵커:' 90%'
}
},{
컬럼 너비: '.2',
항목:{
HiddenName:"infoFill",
이름:"infoFill",
xtype:'label',
html:'',
labelSeparator:'',
앵커:'100%'
}
,{
컬럼 너비:'.8',
항목:{
이름:'rPwd',
HiddenName:'rPwd',
xtype:'textField',
inputType: 'password',
fieldLabel:'비밀번호 확인*',
labelSeparator:':',
BlankText: '두 번 입력한 비밀번호는 동일해야 합니다.' ,
허용:false , // vtype은 확인 방법이므로 일반적인 확인인 경우에는 regex를 사용하면 됩니다.
vtype:'pwdRange',
maxLength:'12 ',
앵커:'90%'
}
컬럼 너비:'.2',
항목:{
HiddenName:"infoFill",
이름:" infoFill",
xtype:'label',
html:'*',
labelSeparator:'',
앵커:'100%'
~
/**
* onReady: 파일이 준비되었습니다(온로드 및 이미지 로딩 전)
**/
Ext.onReady(function(){
searchQueryForm();
//쿼리 양식 가져오기
var queryForm = Ext .getCmp("queryForm").getForm(); Defaluts:{ border:false,bodyBorder:false,activeTab:0},
항목:[queryForm,{id:'centerPanel',region:'center',height :document.body.clientHeight,contentEl:'mainDiv'}]
}) /query information
var store = new Ext.data.Store({
url:'../user/doGetPageList. action', //작업 경로
reader:new Ext.data.JsonReader({
root:'userList', //struts2.0에서 전달된 매개변수: 사용자 컬렉션
totalProperty:'rowTotal', / /struts2.0에서 전달된 매개변수: 정보의 총 행 수
🎜> })
**
* 테두리로 설정된 레이아웃은 페이지가 남동쪽, 북서쪽, 중앙의 다섯 부분으로 나누어진다는 의미입니다.
* 이는 centerPanel이 중앙에 배치된다는 의미입니다.
*/
함수 getMsg()
{
}
/**
* 콜백:
이라는 함수 **/
function submitForm() {
//그리드 초기화
vargrid = null
//체크박스
var sm = new Ext.grid.CheckboxSelectionModel({
dataIndex:'id',
width:'20 '
); 지정하지 않으면 기본 렌더러는 원시 데이터 값을 사용합니다.
> var colM = new Ext.grid.ColumnModel(
Name',dataIndex:'userName',align:'center',sortabel:true}
{헤더:'삭제',dataIndex:' id',align:'center',renderer:function createButton(){
return '
';}},
~ {header:'edit',dataIndex:'userId',align:'center',renderer: function createButton(userId, 메타데이터, 레코드){ a style="cursor:hand" style="cursor:hand" onclick=updateForm(' userId ') >' Record.get('userName') '정보 수정' '< ;/a>';}}]
);
// 쿼리 양식 가져오기
var Form = EXT.GETCMP ("QueryForm")
// 인증 통과 여부를 판단하고, 통과하지 못한 경우 바로 종료해주세요
~ /**
* getLimitCount() : 값이 없는 경우 페이지당 행 수를 가져옵니다. 전달되면 기본값이 사용됩니다. getMsg 함수를 실행합니다.생략 가능
*/
store.load({params:{start:0,limit:getLimitCount()}, callback:getMsg})
if(grid == null) ~ viewConfig:{forceFit:true}, // 전체 창 설정 컬럼 개수 Region:'center', //ViewPort에 표시되는 위치는
cm:colM, //정의된 컬럼
ds:store, //정의된 데이터 소스
border:false,
bodyBorder:false,
, // 정의된 체크박스
// 리스너: 하나 이상의 이벤트 처리 절차를 포함하는 것이 이 객체의 초기화 프로세스에 추가됩니다
청취자: {cellclick: renderPage}},
> xtype:'button', Choose ', Handler: Deluserall, //
Presset의 사용자 정의 실행: TRUE
}],
ID:' PageToolbar ',
PageSize: Qury_page_size, // 페이지당 각 페이지의 행 기본값은 query_page_size
Store: Store,
Displayinfo: True,
Displaymsg: '{0}의 레코드를 레코드에 표시합니다. ; ~ .
var userForm = Ext .getCmp("conditionForm").getForm();
x:10 0, //창의 초기화 x 방향 위치
y:100, // ... ~ . 🎜> 버튼 ; '../user/addUser.action',
params:{roleId:userForm.form.findField('userId').getValue()}， waitMsg:'데이터를 저장하세요. 잠시만 기다려주세요...', //스크롤바 프롬프트 내용
> !"); AddUserWin.hide();
Ext.Msg.alert("Message",message);
> Ext.Msg.alert('프롬프트 메시지'," 새 사용자를 추가하지 못했습니다!");
return; sg.alert("프롬프트 메시지", "양식에 오류가 있습니다. 정확하게 입력해 주세요!")
> ;}, text : 'close'}] }); params:{userId: userId},
메소드:'post',
성공:function(o)
{
var info = Ext.decode(o.responseText); ", info.message);
~. 사용자 정보 삭제 실패!");
> });
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
