Hi kordsmen,
please provide a complete, testable sample of your problem (a URL to a test or post a self-contained test-HTML here in the forum)
Ok here we go..
Here is the the html I use to call my js file:
<cfsetting showDebugOutput="No">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Registration Form</title>
</head>
<link rel="stylesheet" href="../resources/css/ext-all.css" />
<!-- GC -->
<link rel="stylesheet" type="text/css" href="../resources/css/xtheme-aero.css" />
<!-- LIBS -->
<script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
<!-- ENDLIBS -->
<script src="../ext-all-debug.js"></script>
<script type="text/javascript" src="combo.js"></script>
<script src="registration1.js"></script>
<link rel="stylesheet" type="text/css" href="../examples/form/forms.css" />
<!-- Common Styles for the examples -->
<link rel="stylesheet" type="text/css" href="../examples/examples.css" />
</head>
<body>
<div style="width:600px;">
<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
<h3 style="margin-bottom:5px;">Online Registration Form</h3>
<div id="form-ct">
</div>
</div></div></div>
<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
</div>
</body>
</html>
I am using the rc1 version of ext and I am currently running my code in a directory called registration under the rc1 distribution.
Here is the 'js' file for the checkbox version that works:
Ext.onReady(function(){
Ext.QuickTips.init();
// turn on validation errors beside the field globally
Ext.form.Field.prototype.msgTarget = 'side';
/*
* ================ registration form =======================
*/
var registration = new Ext.form.Form({
labelWidth: 275 // label settings here cascade unless overridden
});
registration.fieldset(
{legend:'Attendee Information'},
new Ext.form.TextField({
fieldLabel: 'Organization Name',
name: 'org_name',
width:175,
maxLength:50,
allowBlank:false
}),
new Ext.form.Checkbox({
fieldLabel: 'Does your organization operate in the USA?',
labelSeparator: '',
name: 'checkbox',
hiddenName:'in_wv',
linkedField:"idOfLinkedField",
listeners:{
change:function(field, value){
//alert(value);
var linkedField = Ext.ComponentMgr.get(field.linkedField);
linkedField.allowBlank = value===false||value=="false";
linkedField.clearInvalid();
}
}
}),
new Ext.form.TextField({
fieldLabel: 'If not from USA where?',
labelSeparator: '',
name: 'optional',
width:175,
maxLength:39,
id:"idOfLinkedField"
}),
new Ext.form.ComboBox({
fieldLabel: 'Title',
hiddenName:'contact_title',
store: new Ext.data.SimpleStore({
fields: ['id', 'title'],
data : Ext.combodata.contact_title // from combo.js
}),
displayField:'title',
valueField: 'id',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus:true,
width:190,
maxLength:10
}),
new Ext.form.TextField({
fieldLabel: 'First Name',
name: 'first',
width:175,
maxLength:25,
allowBlank:false
}),
new Ext.form.TextField({
fieldLabel: 'Middle Initial',
name: 'Middle',
width:175,
maxLength:1,
allowBlank:false
}),
new Ext.form.TextField({
fieldLabel: 'Last Name',
name: 'last',
width:175,
maxLength:25,
allowBlank:false
})
);
registration.addButton('Save', function(){
if (registration.isValid()) {
var frmRegister = document.getElementById(registration.id);
frmRegister.method = 'POST';
frmRegister.action = 'save-form.php';
frmRegister.submit();
} else{
Ext.MessageBox.alert('Errors', 'Please fix the errors noted.');
}
});
registration.addButton('Cancel');
registration.render('form-ct');
});
I found out this morning that "select" is what I need to use and that the 3rd argument passed from the combobox gives me the possition that was selected. I can put an alert into the if statement and it fires now but the code to make the optional field required is not functioning like it dose for the checkbox.
Here is the 'js' file for the combobox:
Ext.onReady(function(){
Ext.QuickTips.init();
// turn on validation errors beside the field globally
Ext.form.Field.prototype.msgTarget = 'side';
/*
* ================ registration form =======================
*/
var registration = new Ext.form.Form({
labelWidth: 275 // label settings here cascade unless overridden
});
registration.fieldset(
{legend:'Attendee Information'},
new Ext.form.TextField({
fieldLabel: 'Organization Name',
name: 'org_name',
width:175,
maxLength:50,
allowBlank:false
}),
new Ext.form.ComboBox({
fieldLabel: 'Does your organization operate in the USA?',
labelSeparator: '',
hiddenName:'in_wv',
store: new Ext.data.SimpleStore({
fields: ['id', 'yesno'],
data : Ext.combodata.yes_no // from combo.js
}),
displayField:'yesno',
valueField: 'id',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus:true,
emptyText:'Make a Selection...',
width:190,
allowBlank:false,
editable:false,
linkedField:"idOfLinkedField",
listeners:{
select:function(c, r, i){
if (i == 1){
alert(i);
var linkedField = Ext.ComponentMgr.get(field.linkedField);
linkedField.allowBlank = value===false||value=="false";
linkedField.clearInvalid();
};
}
}
}),
new Ext.form.TextField({
fieldLabel: 'If not from the USA where?',
labelSeparator: '',
name: 'optional',
width:175,
maxLength:39,
id:"idOfLinkedField"
}),
new Ext.form.ComboBox({
fieldLabel: 'Title',
hiddenName:'contact_title',
store: new Ext.data.SimpleStore({
fields: ['id', 'title'],
data : Ext.combodata.contact_title // from combo.js
}),
displayField:'title',
valueField: 'id',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus:true,
width:190,
maxLength:10
}),
new Ext.form.TextField({
fieldLabel: 'First Name',
name: 'first',
width:175,
maxLength:25,
allowBlank:false
}),
new Ext.form.TextField({
fieldLabel: 'Middle Initial',
name: 'Middle',
width:175,
maxLength:1,
allowBlank:false
}),
new Ext.form.TextField({
fieldLabel: 'Last Name',
name: 'last',
width:175,
maxLength:25,
allowBlank:false
})
);
registration.addButton('Save', function(){
if (registration.isValid()) {
var frmRegister = document.getElementById(registration.id);
frmRegister.method = 'POST';
frmRegister.action = 'save-form.php';
frmRegister.submit();
} else{
Ext.MessageBox.alert('Errors', 'Please fix the errors noted.');
}
});
registration.addButton('Cancel');
registration.render('form-ct');
});