This is not what I exactly meant.

I was already using $("#myComboId").igCombo("selectedIndex",-1), and you're right about cleaning text in the combo, but this action does not refill the list. I mean: if I select an item of the combo and then a do a selectedIndex=-1, text is cleaned. But if I re-click on the combo I can only see last selected item, an adding to this, no clean button anymore.

What I would like to know is just a way to emulate the clean button beahvior, because cleaning box with cleaning button brings combo to the original state.

Thanks

Flavio

Hello,

I'm fairly new to jQuery and your components, so bear with me...

I want to obtain the same behavior as Andrey & Flavio, but i can't get this to work.

I can't get into my function using the ".selector".

When i set the event directly to my item, i'm experiencing weird behavior (combo opens, then clears and closes directly)...

Can anyone put me on the right track?

Hi,

could you post here some code? I have not very clear ideas on where you arrived and where you stopped.

Flavio

This gives me the weird behavior:

function InfragisticsComboFix() {

$(document).delegate("#Companies", "igcombodropdownopened", function (evt, ui) {
$("#Companies").igCombo("option", "filteringType", "none");
$("#Companies").igCombo("option", "filteringType", "local");
});

}

evt & ui are not defined when running the above

This results in the event never being fired:

function InfragisticsComboFix() {

$(document).delegate(".selector", "igcombodropdownopened", function(evt, ui) {
ui.owner("option", "filteringType", "none");
ui.owner("option", "filteringType", "local");
});

}

PS: I have no clue about what Stanimir posted (with function(null, ui)). Where would i need to add that?

Hi Michel,

function InfragisticsComboFix() {

$(document).delegate(".selector", "igcombodropdownopened", function(evt, ui) {
ui.owner("option", "filteringType", "none");
ui.owner("option", "filteringType", "local");
});

}

I suppose the code doesn't work, because the DOM hasn't an element with the class .selector. We add the class .selector just to show to an user how to use it. In the first code snippet, you are set CORRECTLY the selector! Params evt and ui aren't used in the code, so you shouldn't really pass them to the function. Here is an example what I mean:

$(document).delegate("#Companies", "igcombodropdownopened", function () {
$("#Companies").igCombo("option", "filteringType", "none");
$("#Companies").igCombo("option", "filteringType", "local");
});

}

Flavio example  is great and I hope it helped you. 

If you have any further questions, do not hesitate to ask.

Regards,

Stanimir

Hello,

I was hoping the .selector would be some kind of "magic trick" that would address all the combo's on the screen (like maybe a css class that all combo's share and that the binding of the delegate would work on all instances). Seeing the ui as parameter in the functions made me believe so...

Too bad it can't work like that, since we have a LOT of combo's in our application and it will be a hastle setting including that script on all pages for every combo. 

Maybe i'll need to do a foreach-type instruction that scans the dom for all igCombo elements...

I'll test the above code again in a clean project, as even with the "dropDownVisible", true (which i tried), i still had the same weird flashing behavior.

Maybe something else is interfering with this code...

I hope with this code I will help you:

In JavaScript

//Combo Initialization
$(".combo").igCombo({
width: "200px",
textKey: "Name",
valueKey: "ProductID",
dataSource: adventureWorks,
enableClearButton: false,
dropDownOpening: function (evt, ui) {
ui.owner.activeIndex(-1);
ui.owner.selectedIndex(-1);
}
});

In HTML:

<div class="combo"></div>
<div class="combo"></div>
<div class="combo"></div>