Combo Box

[Nagash]

Using the tutorialcode in Interactive Demos.

I used the Combobox code to change the Current Pull downs on tha page.

But I need to Assign an onclick event on a certain Pulldown.

Here is the code im using:



Ext.onReady(function(){
function AddExtDropdown(){
for(var i=0; i<arguments.length; i++) {

if (document.getElementById(arguments[i])){
var converted = new Ext.form.ComboBox({
typeAhead: true,
triggerAction:'all',
transform:arguments[i] ,
forceSelection:true
});


};

};

};

// simple array to add pulldowns
AddExtDropdown('Users','TypeContent','FeaturedUserID');


});


using this how can I assign a function to be triggered when the pulldown with an ID of 'TypeContent' is Changed?

I need to get the value of the selection passed to a function

Thanks in advance

[tryanDLS]

Please read the combo documentation. When an item is selected, the select event is fired, passing the record and index of the selected item. There are numerous examples of how to add a listener for an event through out the forums/examples.

[Nagash]

Im still new to OOP so at the moment it does not make any sense

I have successfully added this.


Ext.onReady(function(){
function AddExtDropdown(){
for(var i=0; i<arguments.length; i++) {

if (document.getElementById(arguments[i])){
var converted = new Ext.form.ComboBox({
typeAhead: true,
triggerAction:'all',
transform:arguments[i] ,
forceSelection:true
});
//New Stufff----------------------------
if(converted.getName() == 'TypeContent') {

converted.on('select', function() {
alert(converted.getValue());
}, this);
}

};

};

};

// simple array store
AddExtDropdown('Users','TypeContent','FeaturedUserID');


});


It appears that when i do this the value is not coming in.

Please help.


Please read the combo documentation. When an item is selected, the select event is fired, passing the record and index of the selected item. There are numerous examples of how to add a listener for an event through out the forums/examples.

[Nagash]

In the code I have which I found how to attach the select event Where is 'on'?????

Im still trying to figure out the inheritance. Im guessing that this is what the on is its inherited from somewhere. But where?

How do you figure this out???

I know I dont understand OOP at the moment. But with help I can.

Im just guessing here but it would seem to be be not such an easy anwser. Is it?

[Nagash]

I do seem to find alot of people asking the same thing. Not to be an ass but I see you post just the same answer to everyone.

Is there a simple answer?

Where are these post you say?

Where are the examples?

I have yet to find them.

Any pointers?

Links?

Please help.



Please read the combo documentation. When an item is selected, the select event is fired, passing the record and index of the selected item. There are numerous examples of how to add a listener for an event through out the forums/examples.

[tryanDLS]

I understand you are new to this, but you have to make some attempt to help yourself. That includes reviewing tutorial and examples (both in the zip and in the forums) and if you don't know javascript or OO, the links to other resources to learn those concepts. I would also suggest you read all the sticky threads to get some background and links to other resources.

We answer a lot of questions the same way b/c the information is out there, but we can't possibly find a link to the appropriate reference every time a question is asked. If you spend any time at all here, you'll see the number of posts is quite large and the volunteer support folks (myself included) just don't have the bandwidth to write fullblown answers to every question.

Your response may be that there's not enough examples, code snippets, documentation, etc. We've heard it before and we're working on it, but there are only so many hours in a day to work on 2 code streams, documentation, bugs, support, examples, etc.

[Nagash]

Ive spent at least 6 hours searching . Looking in the API etc. I still cant find where the ON is...... * sight*
Its not that I havent tried.

I ALWAYS leave posting to a forum as a last resort.
I always do that.


I was hoping that for someone with knowledge on Ext to just write a simple answer.

So Im guessing that the answer is more complicated than what it seems. I guess Ill have to drop Ext use until I can more fully understand what OOP in JS is all about.

Again not trying to be an ass.

How easy is it to get the value of the Onchange event using my code? Since apperantly no one here knows the answer or is unwilling to show/help. (Not you) I understanst that someone working in Ext does not have the time.

2 lines of code??

More than 10?

Just wondering. At this moment Im stripping all Ext code from my Js Files. *Sight* and redoing it with simpler Function calls that I use all the time.

I wanted to get into OOP in JS using Ext but I guess that will have to wait.

:(




I understand you are new to this, but you have to make some attempt to help yourself. That includes reviewing tutorial and examples (both in the zip and in the forums) and if you don't know javascript or OO, the links to other resources to learn those concepts. I would also suggest you read all the sticky threads to get some background and links to other resources.

We answer a lot of questions the same way b/c the information is out there, but we can't possibly find a link to the appropriate reference every time a question is asked. If you spend any time at all here, you'll see the number of posts is quite large and the volunteer support folks (myself included) just don't have the bandwidth to write fullblown answers to every question.

Your response may be that there's not enough examples, code snippets, documentation, etc. We've heard it before and we're working on it, but there are only so many hours in a day to work on 2 code streams, documentation, bugs, support, examples, etc.

[tryanDLS]

'on' is the shorthand equivalent to addlistener. http://extjs.com/deploy/ext-1.1-rc1/docs/output/Ext.Element.html#addListener or also see this http://extjs.com/deploy/ext-1.1-rc1/docs/output/Ext.util.Observable.html

If you stop in Firebug inside your select handler, is the variable valid?

[Nagash]

Well Havent given up but I still cant get the Selected Pulldown Value. I cannot figure out the sintax on what was selected.

It must be just something so simple. I know it. I just cant figure it out no matter what I throw up at the cealing. Nothing sticks.

I just want the value of the selected pulldown to be passed to a function onchange.

Please please help.




'on' is the shorthand equivalent to addlistener. http://extjs.com/deploy/ext-1.1-rc1/docs/output/Ext.Element.html#addListener or also see this http://extjs.com/deploy/ext-1.1-rc1/docs/output/Ext.util.Observable.html

If you stop in Firebug inside your select handler, is the variable valid?

[evant]

You're being vague, "can't" does really help out. You need to specifically say what happens and post the most recent code sample.

Do you get an error message? In what context is your code running?

Just looking at your code, it's probably the scope of your handler. Note in the documentation, the 'select' event passes you the combo box, the record and the index, so something like this:



box.on('select', function(combo, row, index)
{
alert(combo.getValue());
}, scope);

[Nagash]

Im unsure what you mean.

The above code is all I have.

This is what I need it to do.

1. Change the select boxes I have on the current page to the Ext Combo box. This works perfectly. No error.

2. I need to trigger onchange event when the 'TypeContent' Select box is changed. I need to pass the Value that was selected to a function. that function will hide certain Form fields from the user. The function is already working I just cant seem to pass the value of the selected Pulldown to this function.

That is all. I had it all working with the JS I created. Its not that Im a newbie to Javascript. Im just new to Ext and how to use it. Seems to me that it would be simple to pass the value of the selected Pull down. But no one seems to undertsand the code I posted. Ill try again.


Select Box:

<label for="TypeContent" id="TypeContentLabel">Select Type Content <select name="TypeContent" id="TypeContent">
<option value="">Select Type Content </option>
<option value="1" selected>Article</option>
<option value="2">News</option>
<option value="3">Featured User</option>
<option value="4">Video</option>
<option value="5">Audio</option>
<option value="6">Photos</option>
</select></label>

Ext Javascript


Ext.onReady(function(){
function AddExtDropdown(){
for(var i=0; i<arguments.length; i++) {

if (document.getElementById(arguments[i])){
var converted = new Ext.form.ComboBox({
typeAhead: true,
triggerAction:'all',
transform:arguments[i] ,
forceSelection:true
});

if(converted.getName() == 'TypeContent') {

converted.on('select', function(combo, row, index)
{
alert(combo.getValue());
}, scope);
};
};

};

};

// simple array store
AddExtDropdown('Users','TypeContent','FeaturedUserID');


});






Thats all there is. No more no less. Other than the


<script type="text/javascript" src="/scripts/ext/ext-all.js"></script>
<script type="text/javascript" src="/scripts/ext/extScripts.js"></script>


Now How do I pass the Value of the selected Pulldown to the Function?????


you say to use this:



box.on('select', function(combo, row, index)
{
alert(combo.getValue());
}, scope)



I added that to my code. And Nothing happens. Ext seems to niot work when I add this and Firebug show no errors

What Am I diong wrong???

ANY insight to this would help me undertsand more how to use etx.

The help has been good but no one seems to undertsand what Im trying to accomplish *Just a little frustrated*

[Nagash]

This seems to work........... * relieved*



Ext.onReady(function(){
function AddExtDropdown(){
for(var i=0; i<arguments.length; i++) {

if (document.getElementById(arguments[i])){
var converted = new Ext.form.ComboBox({
typeAhead: true,
triggerAction:'all',
transform:arguments[i] ,
forceSelection:true
});

if(converted.getName() == 'TypeContent') {

converted.on('select', function(converted)
{
HideFormFileds(converted.getValue());
}, this);
};
};

};

};

// simple array store
AddExtDropdown('Users','TypeContent','FeaturedUserID');


});

function HideFormFileds(id){

switch (id){
case "1":
alert('hide some 1')
break;
case "2":
alert('hide some 2')
break;
case "3":
alert('hide some 3')
break;
case "4":
alert('hide some 4')
break;
case "5":
alert('hide some 5')
break;
case "6":
alert('hide some 6')
break;
};



};

I still not sure why "this" is in the on

[evant]

Because you need to read about javascript scope:
http://extjs.com/forum/showthread.php?t=6336