Hi,
We are using Ignite 16.1 igcombo with ASP.Net Core 1.0 client side jquery controls. We have enabled customValue for that combo. When we enter a new custom value in the combo and directly click on SAVE button without clicking anywhere, the value is not sent to the server.
After analysis we figured out, it could be due to combo not loosing focus (hence the value was lost) when SAVE button is clicked. After entering customvalue in the combo and explicitly clicking outside the control before clicking on SAVE, passes the value to the serve
Ideally it should automatically loose focus when a button us clicked. Do we have any property to make control loose focus? Is it a known issue?
Thanks,
Valliappan
Hello Valliappan,
Thank you for contacting us.
Could you please send me a sample so I could better understand the scenario?
I am looking forward to hearing from you.
I used your sample code from your website and tweaked it to reproduce the issue (www.igniteUI.com)
http://jsfiddle.net/z0r1jkrx/32/
Steps to reproduce:
1. Enter the word "Cha" in the igCombo. (The custom value partially matches existing value in the drop down)
2. Directly click "Submit" link without clicking anywhere and the alert shows the current custom value "Cha"
3. Now edit "Cha" to "Cha1" (No match found displayed).
4. Directly click "Submit" link without clicking anywhere and the alert still shows the previous custom value "Cha" instead of "Cha1"
PS: We use latest Chrome browser. We are able to reproduce in both Chrome and IE
We are able to reproduce this issue most of the times and sometimes it takes couple of sequential attempts to reproduce. We concluded that the issue is something to do with Combo not loosing focus and hence doesn't retain the new value
This looks like a bug. If this is a bug, any work around?
Thank you for your sample and explanation. It was very helpful.
This is an expected behavior since you click submit while the dropdown is still opened and the value is not changed. The correct approach here will be to check whether the dropdown is opened and close it just before you submit the form.
Here is a sample based on your sample - http://jsfiddle.net/z0r1jkrx/33/. I hope you benefit from it.
Please let me know if you need further assistance.
Thanks for the sample Tihomir. It kind of works but we have a few complications.
Issue1:
We have multiple igcombo box in the page, so i wanted to do it for all combos in 1 shot rather than individual combos and also when user is done with the selection or enters customvalue.
I was trying the below code in form $(document).ready function.
$(document).delegate(":input", "igcomboselectionchanged", function (event, ui) { var elementId = ("#" + event.currentTarget.id);if ($(elementId).igCombo("dropDownOpened") === true) {
$(elementId).igCombo("closeDropDown", function() { }); }
});
It looks like igcomboselectionchangedevent is not fired when user types a custom value but fires when user selects a value from the drop down list. Do we have better event to handle this logic?
Issue 2:
Even in your sample, if user types too quick (before "no match found displays") and hits enter, system does not detect the value.
Please advise
Thank you for your update.
1. Selection Changed is fired only when you change the selection with existing value from the dropdown. It is not fired for custom values. Depending on your goal, you could get the html input using our method textInput - http://www.igniteui.com/help/api/2016.1/ui.igcombo#methods:textInput. After that you can use the jQuery change or focusout events.
2. You are right. RefreshValue (http://www.igniteui.com/help/api/2016.1/ui.igcombo#methods:refreshValue) method should be called before submitting the form to make sure we updated the value if we had custom value.
Here is a sample demonstrating resolving the two issues http://jsfiddle.net/z0r1jkrx/57/.