We Keep Coding

Trying to add functionality to select option

In my program the user first enters some data to filter and the result goes to one dropdown select menu lets call this functionality function_1 . If there is only one result the it goes to make another query, lets call this function_2.
My problem here is when i have 2 or more results i should be able to:
1) check out the different options i get by clicking on the select to display all the options with a scrollbar if needed
2) After he saw the options there he clicks on one of them to activate function_2
The usual answers use the "change" event but, wont work if the user picks first default value because there is no change, he would have to pick an undesired result and go back to the first.
Using the click event on the select makes also unnecessary work because it triggers twice (one when i open the dropdown, other when option is selected)
Main problem here i think is the jquery selector, but im not sure if it can be done just with that.
This is an example of what im trying:
// function_1 in ajax
.done(result){
$.each(result.data,function (){
$('#select_ex').append("<option value...... ></option>");
if (result.count()===1){
$('#select_ex').trigger('change');
}
});
}
$('#select_ex option').change(function(){// tried with change, click or focus
function_2();
}
The html contains
<select name="select_ex" id="select_ex" size="0" ></select>
EDIT:
Not related to the duplicate question mentioned, since i already know why it doesnt select the option, besides it doesnt apply either since it only talks about connectors with ID, which is not even the point here (I could do my thing without IDs). Im asking for funcionality similar to ":selected" but with option->click.
Another workaround i thought of is filling the select with an empty/hidden field and set the selected property it, filtering afterwards and using the regular change event... but then the first item would be blank and doesn't seem very logic to me.
So I came to seek for any fresh ideas.
EDIT2
I added a white option for the multiple result and erased it afterwards by adding this line of code to imvain2 solution (where needed)
$("#select_ex option[value='0']").each(function() {$(this).remove();});

Although fixing your change function so that is is called for the select and not the option is important, your problem is the default selected option itself. As you mentioned, if they want the first option, they have to select something else to trigger the change function.
I would recommend adding a "blank" option as the first option and setting it as selected.
var $select_ex = $("#select_ex");
.done(result){
$select_ex.empty().append("<option value='0'>Select Your Ex Below!</option>");
$.each(result.data,function (){
$select_ex.append("<option value...... ></option>");
});
$select_ex.val("0");
}
$select_ex.change(function_2);

yadcf external trigger loads twice

I am using jquery.dataTables.yadcf.js and //cdn.datatables.net/1.10.6/js/jquery.dataTables.js with sAjaxSource
I'm trying to use external filters that triggers several columns to a pre-selected filter at once. So you click a button and there, three columns are picked out so you don't have to go in each drop down.
But the way I'm doing it seems wrong, because I'm seeing two JSON requests instead of one every time they're triggered.
All I have in my script is
function doTrigger(){
yadcf.exFilterColumn(oTable, [[0,"zero"],[1,"one"]]);
$("#yadcf-filter--oTable-" + 1).val("one");
oTable.fnDraw();
}

Your code should look like this: I haveadded third argument true, its undocumented, but needed when calling the exFilterColumn after table finished loading
function doTrigger(){
yadcf.exFilterColumn(oTable, [[0,"zero"],[1,"one"]], true);
}
The rest of your code is not needed at all...

How to edit selectize input after calling selectize()

My goal is to reset selected values in selectize input. I called selectize function in seperate js file (working with Ruby on Rails), so there is no option to create some global selectize input variable (at least I want to avoid it).
In select2 I would solve similar issue like that:
$(".select2").select2("val", "")
but when I call selectize() second time on the input all previous options and collection loaded via ajax just dissappear.
Thanks for help

Selectize uses .selectized as its identifying class.
Unfortunately, selectize is not accessible via $('.selectized').selectize - you need to go directly to the <select>/<input> element - $('.selectized')[0].selectize as shown in the docs.
I don't believe you can access all selectize items at once, you need to iterate through them. I recommend using the map function, such as something like:
$.map($('.selectized'), function(item, index) {
item.selectize.setValue('');
});

How to save data for previous selected value in a drop down list (before change) in jquery

It would be little complicated. Suppose I have a select list with items as status.I select a status and do some modification in the page, when I change to different status all the modificatiions which I did for previous selected status should be saved and send to a servlet. I was trying to do using change() , but it was taking current select field. and Also page relaods when status from the select is is changed thats y all the previous selected fields value also get lost.
Do anyone have ides of how to do it using jquery/Javascript as if I get the value I can pass to the servlet.
Basically I work on component based java using Apache Click framework. If some can relate with that too it would be great help too.

basically you need to store the previous value yourself and keep track of it, something like that:
var $selectElement = $("#selectElement");
$selectElement.change(function () {
var previousValue = $selectElement.data("previous");
//do something with previous value
$selectElement.data("previous",
$selectElement.find("option:selected").val);
}).change();
a quick example http://jsfiddle.net/dCkwd/

Try storing the values in a cookie with the jQuery $.cookie plugin and updating the cookie on change(). You can then access the latest cookie value.
I hope this helps!

YUI Custom Event for Dropdown value pre-selection?

I have a dropdown field and its value is pre-selected as soon as its rendered (Say, its a Country field in a signup form). And I have other dropdowns or other components which change the selected value of the first dropdown dynamically. Now I want to fire a method with every "value getting selected" in the dropdown. Is it possible?
To put my question in much more clearer way, I want to create a onDefaultValueSet event and subscribe the first dropdown to it. So in which ever way the dropdown gets any value selected, the corresponding handler (my function) gets called.
I tried to do it with YUI Custom Events, but I am not sure how the browser will be calling(understanding) my handler every time a value is selected in the dropdown.
onSelect (from Default DOM) is not a right answer I guess, as I tried it.
Please help me in tackling this problem.

I am not sure whether this is an answer, but I've found a workaround. Please validate this.
So I was making a item "selected" using javascript-dom manipulation. Meaning, using
domElement.options[5].selected = True;
So with the (YUI)custom event I created, I started calling "fire()" right after this. So the code becomes:
domElement.options[5].selected = True;
onDefaultValueSetEvent.fire(domElement.name);
But I am not sure, what if the particular option is selected in a gui fashion. Meaning, how automatically fire() method is called