PDA

View Full Version : [ext] Ext.get('name').dom.value didn't work in FF



gravic
24 May 2007, 2:43 PM
Heelo,

I have a problem, it's code from ext's site with my modifications:



<script type="text/javascript">
Ext.onReady(function(){

Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'side';

var form_employee = new Ext.form.Form({
labelAlign: 'left',
labelWidth: 175,
buttonAlign: 'right'
});

var employee_name = new Ext.form.TextField({
fieldLabel: 'Name',
name: 'name',
width:190
});

var employee_title = new Ext.form.TextField({
fieldLabel: 'Title',
name: 'title',
width:190
});

var employee_hire_date = new Ext.form.DateField({
fieldLabel: 'Hire Date',
name: 'hire_date',
width:90,
allowBlank:false,
format:'m-d-Y'
});

var employee_active = new Ext.form.Checkbox({
fieldLabel: 'Active',
name: 'active'
});

form_employee.fieldset(
{legend:'Employee Edit'},
employee_name,
employee_title,
employee_hire_date,
employee_active
);

form_employee.addButton('save', function(){
if (form_employee.isValid()) {
var msg = Ext.get("msg");
msg.load({
url: "http://127.0.0.1/mySite/htdocs/def/controller/action/",
params: "name=" + Ext.get('name').dom.value,
text: "Loading..."
});
msg.show();
}else{
Ext.MessageBox.alert('Errors', 'Please fix the errors noted.');
}
}, form_employee);

form_employee.render('employee-form');

});
</script>


html


<div id="msg"></div>
<div id="employee-form"></div>


php


if(isset($_POST['name'])) {
echo 'From Server: '.json_encode($_POST['name']);
}


all is fine in IE and Opera but FF gives something error: "Ext.get("name") has no propertis"
when I remove ".dom.value" from "Ext.get('name').dom.value" Loading is working but result is "From Server: "null""

Enybody can help me? :)

big thanks.

ps. is any method to send to PHP all variables ('name', 'title', 'hire_date') without writting this:


params: "name=" + Ext.get('name').dom.value
etc..

BernardChhun
24 May 2007, 5:59 PM
Ext.get works with IDs so add an id to your field as well :


var employee_name = new Ext.form.TextField({
fieldLabel: 'Name',
id : 'name',
name: 'name',
width:190
});

jsakalos
24 May 2007, 6:18 PM
You should be also able to use employee_name.getValue(). I would say that this is preferred method as Ext provides some level of DOM abstraction. I personally use Ext methods wherever possible and direct DOM node addressing only as a last resort.

Of course, you should use id's as Bernard advices. If you don't ids are auto-generated by Ext anyway.

gravic
25 May 2007, 6:23 AM
Big thanks guys, it's work!

I have one more question :)
How to send all params form all inputs?
When I do taht:


params: "name=" + employee_name.getValue(),
params: "title=" + employee_title.getValue(),

PHP gets only last one param, in this case: title

and later how to display data form database in proper input (using in php json_encode)?

one again, really thanks for help :)

BernardChhun
25 May 2007, 6:58 AM
[...]params: "name=" + employee_name.getValue() + "&title=" + employee_title.getValue(),[...]

this one should work right. The way you did it in 2 lines...well it's normal that you erased the last params entry!

as for writing your data in the form you will have to use the form's setValue function:


yourForm.setValues({"field-id": field-value});

field-id is equal to the ones in your form. The dictionary that is passed to setValues could be the one that your php will answer to a xhr call for example.

gravic
25 May 2007, 8:33 AM
hmm, I do it in this way:


form_employee.addButton('save', function(){
if (form_employee.isValid()) {
employee_data = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url: 'http://127.0.0.1/mySite/htdocs/def/controller/action/'}),
reader: new Ext.data.JsonReader({},['name']),
remoteSort: false
});
employee_data.load();

employee_data.on('load', function() {
employee_name.setValue(employee_data.data.name);
});
}else{
Ext.MessageBox.alert('Errors', 'Please fix the errors noted.');
}
}, form_employee);


php


$arr = array();
$arr['name'] = 1;
echo json_encode($arr);


as a result, I get in name input: undefined

where is bug?

tryanDLS
25 May 2007, 8:54 AM
You added your load handler after you called load, so it's never going to fire.

gravic
25 May 2007, 9:18 AM
of course ... I corrected it, but still nothing :-?



[...]
employee_data = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url: 'http://127.0.0.1/...../action'}),
reader: new Ext.data.JsonReader({},['name']),
remoteSort: false
});

employee_data.on('load', function() {
employee_name.setValue(employee_data.data.name);
form_employee.addButton('save', function(){
if (form_employee.isValid()) {

}else{
Ext.MessageBox.alert('Errors', 'Please fix the errors noted.');
}
}, form_employee);
form_employee.render('employee-form');
});
employee_data.load();
[...]

tryanDLS
25 May 2007, 10:22 AM
You're calling setValue with invalid data - store.data is a collection of records.

gravic
25 May 2007, 10:31 AM
You're calling setValue with invalid data - store.data is a collection of records.
now the script display nothing.

gravic
25 May 2007, 12:20 PM
When I try add getAt(0) like this:

employee_data.getAt(0).data.name
(example from Ext tutorial http://extjs.com/tutorial/loading-data-submitting-form)
I get error in debug console:
employee_data.getAt(0) is empty or that's not a object
When I do that:

employee_name.setValue("sth");
all goes fine.

I really haven't any more ideas... :(

tryanDLS
25 May 2007, 12:33 PM
Did you look at the response in firebug - is it even coming back? Set a BP in your load handler did it get there? Step thru the store.load code to see where you're failing.

gravic
25 May 2007, 1:06 PM
From Firebug Console
GET http://127.0.0.1/site/htdocs/b.php (62ms)
Rseponse
{"name":"a","title":"b"}
so communication between EXT-PHP is ok

gravic
25 May 2007, 11:44 PM
Maybe someone try my script... :)

In Attach Files are a.php (with JS script) and b.php (with simple php json_encode)

thanks.

gravic
27 May 2007, 10:21 AM
so.. nobady hasn't any ideas? :)

amackay11
28 May 2007, 10:07 AM
I'd suggest not using 'name' as your data field (try cname, iname or something), even though the example has 'name'. Also, use the 'dom' view in firebug to see what is in the data store.

As tryanDLS said, put a break-point here


employee_data.on('load', function() {

>>>>>> employee_name.setValue(employee_data.data.name);
employee_title.setValue(employee_data.data.title);

gravic
28 May 2007, 12:19 PM
after add:

echo "[".json_encode($arr)."]";
and

employee_data.getAt(0).data.iname
everything working fine

big thanks for all :)