Hello,
I am using IG version 17.2 with VS 2012. I have a databound WebDropDown in MultiSelect mode. What I am trying to accomplish is: Allow the user to enter a new item into the DropDown control and SQL database table, select that item, then display the new item in the DropDown text. I will deeply appreciate any help on how I can accomplish this or if it's possible.
Please find attached my sample solution and database samples attached.
Thank you,
Apologies.. Link to sample project blow.
https://drive.google.com/open?id=1UO88ybpsjxHMo9rlvvMDvoIa1HGdgh9X
Hello!
Thank you for using Infragistics ASP.NET!
Thank you for the provided sample – I had troubles running it but the code helped me to understand your scenario.
Can you please tell me where does your scenario fail? Is the new item not added to your database? Or the item is not added to the dropdown control when executing the “OnSucess” function?
I think this help topic may be of help as the scenario looks similar to the one that you need - https://es.infragistics.com/help/aspnet/webdropdown-custom-values-and-persistence
Can you please look at it and let me know if this is resolving your issue?
Thank you once more for contacting the Infragistics support!
I am looking forward to your response!
Best regards, Alexander Marinov
Thank you for your response!
Can you please clear out an additional question - you have the "Other" item defined in your database and you do not want to replace this item in the database with the custom item but you want to replace it on the client only. And the custom item, except for replacing the "Other" item on the client, should also be added to the database. Is that correct?
Alex,
You are correct. The newly entered item is not to replace the "Other" item in the database, The newly entered item is added to the database using the PageMethod. The "Other" item on the client is unselected and replaced with the newly entered item and displayed on the client. The bolded code lines below is where the scenario is failing. It not producing an error but just not performing as I intend..
function cboFTEName_DropDownClosed(sender, eventArgs) { ///<summary> /// ///</summary> ///<param name="sender" type="Infragistics.Web.UI.WebDropDown"></param> ///<param name="eventArgs" type="Infragistics.Web.UI.DropDownContainerEventArgs"></param>
var FTEcombo = sender; var Items = sender.get_selectedItems(); for (i = 0; i < Items.length; i++) { if (Items[i].get_text() == "Other") { var newFTEName = prompt("Enter Name of Other FTE:", ""); if (newFTEName !== null) { if (confirm("You are about to add a new FTE Name to the database.\n Are you sure you wish to continue?")) { //Add the newly entered FTE Name to the database table. PageMethods.AddNewFTEName(newFTEName, OnSucess, OnFailure); } function OnSucess(response, UserContext, methodName) { //Add the new FTE Name to the client dropdown and select it. if (response.length > 0) { var idpos = response.indexOf("|"); var newid = response.substring(0, idpos); var item = FTEcombo.get_items().createItem(); item.set_text(newFTEName); item.set_value(newid); FTEcombo.get_items().add(item); var itemIndex = item.get_index(); FTEcombo.selectItemByIndex(itemIndex); var FTEItems = FTEcombo.get_selectedItems(); //Unselect the "Other" Selection and replace with the new entry on client for (j = 0; j < FTEItems.length; j++) { if (FTEItems[j].get_text() == "Other") { FTEItems[j].unselect(); var strValue = FTEcombo.get_currentValue(); var newValue = strValue.replace("Other", newFTEName); FTEcombo.set_currentValue(newValue); } } } } function OnFailure(error) { alert(error.get_message()); } } } }}// --></script>
I think I managed to execute the desired scenario. What you need is to provide a second argument to the "set_currentValue" method. This argument is about if the current value should be copied to the input. Basically, you were successfully updating the actual value of the control but the input was not reflecting this change.
So, your line should look like this:
FTEcombo.set_currentValue(newValue, true);
About your other issue – the “Other” checkbox not being unchecked – I am not able to reproduce this behavior. The checkbox is unchecked after executing
FTEItems[j].unselect();
I am attaching a simplified solution that demonstrates this scenario. This is not saving the new item to the database and is just updating the value in the input. In my example I use the “Seafood” item as the “Other” item in your scenario.
If you have further issues with this scenario do not hesitate to contact the Infragistics support again.
Also, if the “Seafood” item is not unchecked when running the example on your machine – please let me know.
Thank you once more for using Infragistics ASP.NET!
Best regards, Alexander MarinovWebDropDown_Sample.zip
Thank Alex,
Your example works fine and thank you for the tip about including the "true" pararameter in the set_currentValue method. However, in my project the results are inconsistant. The "Other" item sometimes get unchecked and other times it doesn't. I also sometime get the error message "Server not responding" when the set_currentValue method is envoked. The new value is being added to the list but not being selected and not replacing the "Other" text in the dropdown display. Do you suppose it has something to do with the add_item method?
//Add the new FTE Name to the client dropdown and select it. if (response.length > 0) { var idpos = response.indexOf("|"); var newid = response.substring(0, idpos); var item = FTEcombo.get_items().createItem(); item.set_text(newFTEName); item.set_value(newid); FTEcombo.get_items().add(item); var itemIndex = item.get_index(); FTEcombo.selectItemByIndex(itemIndex);
Thanks,
Hi,
I have updated the sample and I believe this will resolve your entire scenario now. Please, give it a try and let me know if this is working fine on your end.
Basically, this is the change inside the "for" loop:
for (j = 0; j < FTEItems.length; j++) { if (FTEItems[j].get_text() == "Seafood") { FTEItems[j].unselect(); var strValue = FTEcombo.get_currentValue(); var newValue = strValue.replace("Seafood", newFTEName); FTEcombo.set_currentValue(newValue, true); FTEcombo.get_items().remove(FTEItems[j]); var item = FTEcombo.get_items().createItem(); item.set_text(newFTEName); item.set_value(newFTEName); item.set_selected(true); FTEcombo.get_items().add(item); } }
WebDropDown_Sample_Updated.zip
If you have additional questions or issues on this scenario, do not hesitate to contact the Infragistics support again!
Best regards, Alexander
Thank you Alex,
That worked great. I did not remove the "Seafood" item from the list, I simply moved the code that added the new item to the dropdown after the unselect() method on the seafood item as your code shows.