SoFunction
Updated on 2025-02-28

ExtJs The text box is followed by the description text + the drop-down list to select the value and trigger the event


var showForm;
function panelShowForm()
{
showForm=null;
showForm = new ({
renderTo:"showPanel",
region:'north',
border:false,
bodyBorder:false,
frame:true,
waitMsgTarget: true,
labelAlign:'right',
id:"showForm",
items:[{
layout:'column',
labelWidth:129,
items:[
{
columnWidth:.6,
layout:'form',
items:{
name:"enable",
hiddenName:"enable",
fieldLabel: 'Whether to enable password policy',
xtype:'combo',
editable: false,//Enter lazyRender:true,
blankText: 'The password must be enabled', // is the default value
allowBlank : false, //Not allowed to be empty
mode: 'local',
triggerAction: 'all',
store:new ({
fields: ["value", "text"], data: [['1','enable'],['0','disable']]
}),
// These two items must correspond to the fields above
valueField :"value",
displayField: "text",
listeners:{ change:function(){changeValue();}
},
anchor:'100%'
}
},{
columnWidth:.4,
layout:'form',
items:{
hiddenName:"infoFillOne",
name:"infoFillOne",
xtype:'label',
html:'<font color=red> is set to disabled, the following items are not available</font>',
labelSeparator:'',
anchor:'100%'
}
},{
columnWidth:.6,
layout:'form',
items:{hiddenName:"updateDay",
name:"updateDay",
xtype:'textfield',
fieldLabel: 'Update cycle',
emptyText: 'Set to -1 This item is disabled',
maxLength:'100',
readOnly:false,
vtype:'day',
anchor:'100%'
}
},{
columnWidth:.4,
layout:'form',
items:{
hiddenName:"info",
name:"info",
xtype:'label',
//labelAlign:'left',
html:
'<font color=red> is set to -1, then this item is disabled</font>',
labelSeparator:'',
anchor:'100%'
}
}]
}]
})
}

/**
* Whether to enable the trigger event of password
*/
function changeValue()
{
if(('enable').getValue()=="0")
{
$("updateDay").disabled = true;
}else{
$("updateDay").disabled = false;
}
}
/**
* Display of window
*/
function input()
{
panelShowForm();
win=new ({
title:"extJs text box with an extJs",
width:200, //The initial width value of the window
high:200, //The initial high value of the window
x:100, //The initial x position of the window
y:100, //The initial y position of the window
plain : true,
modal : true, //Mode window
maximizable:true, maximize display
resizable:false, //The size of the window is not allowed to be dragged
items:[showForm]
})
}