issue get items when Webdropdown closing

245

NguyenTien posted over 10 years ago

Hi all.

i have webdropdown search and loadondemand.

when the search results are just one item. I want the item to be selected.

I've tried checking in DropDownClosing event. If there are 2 items (including blank item), the item second to be selected

but i can't get list item in this event or can't get value this item.

Please see demo behind and help me.

Thanks!

DdlProvider_LoadOnDemand.zip

Parents

16310

Offline Hristo Anastasov posted over 10 years ago
Hello Nguyen,

Thank you for your sample. I carefully followed your code and noticed this line:

var item = sender._elements["List"].childNodes[1];

This will return a

DOM element. Later you are trying to get the value and text by calling item.get_value() and item.get_text(), but these are not functions that you can run on DOM elements. Instead get the item this way:

var item = sender.get_items()._items[1];

and then item.get_value() and item.get_text() will return the correct results.

Please see how this part of your code should look like:

Code Snippet

var itemSelected = sender.get_selectedItem();

// next line will return true when the search results are 2 items (including blank item) and the selected item is the second item

if (sender.get_items()._items.length == 2 && itemSelected.get_index() == 1) {

    var item = sender.get_items()._items[1];

    if (itemSelected != null) {

        flagInit = true;

        var olistItems = sender.get_items()._items;               // returns an array with the items

        document.getElementById("HD_Entity_ID").value;           // correctly returns the value

        if (itemSelected != null) {

            document.getElementById("HD_Entity_ID").value = itemSelected.get_value();  // will return value of the selected item

            document.getElementById("HD_Entity_Name").value = itemSelected.get_text(); // will return text of the selected item

            document.getElementById("HD_SearchType").value = "";

            sender.set_currentValue(itemSelected.get_text(), true);

            return;

        }

        document.getElementById("HD_Entity_Name").value = itemSelected.textContent; // what do you try to get here ?

        document.getElementById("HD_SearchType").value = "";

        sender.set_currentValue(item.textContent, true);

        return;

    }

}

Apart from this I am not sure what is the whole idea of the code in the DropDownClosing event. If you clarify these for me maybe I will be able to rewrite the whole function inside:

1) Do you want to check which is the selected item on dropDownClosing or you want to programmatically select an item ?

2) What do you want to do if the 2nd item is selected or after you have selected it in code ?

I hope this helps. If you answer my questions I will be glad to help you further.
Cancel
Reply

Cancel
245

NguyenTien posted over 10 years ago in reply to Hristo Anastasov

Hello Hristo, thank your help.
With your questions about idea of the code in the DropDownClosing event:

I want when I search on the dropdown. If the search results are 2 items, the 2nd item must be selected automatically without the user to select that item.
If the search results more than 2 items. the user does not select item. webdropdown will set selected item value before search.

1) I want to programmatically select an item.
2) When user close dropdown and don't selecte item. webdropdown will be set selected item.

In addition I have checked your code. it is true when the user selects one item but does not help in my case.

Please help me, thank you very much!
Cancel
Reply

Cancel
16310

Offline Hristo Anastasov posted over 10 years ago in reply to NguyenTien
Hello Nguyen,

Thank you for your answers.

I assume that by "search results" you mean the items visible in the drop down list. I hope I have understood you correctly and I have slightly changed the function you execute in order to work for your scenario.

Please have a look and let me know if there is something I am missing or I did not understand.

Here is a brief overview how this function works when closing the drop down:

1) If there is any item active(selected), its value and text are assigned to the HD_Entity_ID and HD_Entity_Name inputs. // line 3 - 12

If the selected item is the blank item, HD_Entity_ID and HD_Entity_Name have empty strings assigned // line 14 - 22

2) If no item is active(selected) // line 26

If the search resuts( the items in the dropdown) are two, the second item is selected automatically and its value and text are assigned to the HD_Entity_ID and HD_Entity_Name. // line 28 - 40

If there are more than two search results (or less) return the old value // line 43-48

Code Snippet

function wcType_DropDownClosing(sender, eventArgs) {

    var selectedValue = 0;

    if (sender._activeItem != null) { // returns true if there is active item (p.s. if an item is selected activeItem will be the same)

        if (parseFloat(sender._activeItem.get_value()) != 0) {

            selectedValue = parseFloat(sender._activeItem.get_value());

            flagInit = true;

            document.getElementById("HD_Entity_ID").value = selectedValue;

            document.getElementById("HD_Entity_Name").value = sender._activeItem.get_text();

            document.getElementById("HD_SearchType").value = "";

        }

        else {

            if (iOpen != 1) {

                flagInit = true;

                document.getElementById("HD_Entity_ID").value = "";

                document.getElementById("HD_Entity_Name").value = "";

                document.getElementById("HD_SearchType").value = "";

                return;

            }

        }

    }

    else { // will execute if no item is active (selected)

        if (sender.get_items().getLength() == 2) {                      // returns true if the items are two

            sender.selectItemByIndex(1);                                // select the second item programatically

            var itemSelected = sender.get_selectedItem();               // get the selected item object

            flagInit = true;

            var olistItems = sender.get_items();                                       // returns the DropDownItemCollection

            document.getElementById("HD_Entity_ID").value = itemSelected.get_value();

            document.getElementById("HD_Entity_Name").value = itemSelected.get_text();

            document.getElementById("HD_SearchType").value = "";

            sender.set_currentValue(itemSelected.get_text(), true);

            return;

        }

        // will execute if search results has more or less than 2 items and no one item selected, return old value

        else {

            flagInit = true;

            document.getElementById("HD_SearchType").value = "";

            sender.set_currentValue(document.getElementById("HD_Entity_Name").value, true);

            return;

        }

    }

}

I hope this helps. Please let me know if this logic correctly follows your scenario of if it needs some changes.
Cancel
Reply

Cancel
245

NguyenTien posted over 10 years ago in reply to Hristo Anastasov

Hi Hristo

Thank you for your answers.

i has fixed my code. it's work very good. thank you very much :)

I wanted to ask a little more:

when i enter "123_" on dropdown. search results have 2 item (blank and 123_guarantor)

click out dropdown, the item "123_guarantor" must be selected.

my program run not ok with first.

Please see new demo behind and help me fix that

DdlProvider_LoadOnDemand.zip
Cancel
Reply

Cancel

Reply

16310

Offline Hristo Anastasov posted over 10 years ago in reply to NguyenTien

Hello Nguyen,

Thank you for your sample. I reviewed and noticed that you have placed return; on line 63 - when this line executes your function stops here and below code does not execute. I have removed this line and now it works as expected. Please review the sample I have attached - I have only put this line in comment, everything else is the same.

I have also included comment to line 65 - please have a look.

I hope this helps.

DdlProvider_LoadOnDemand.zip
Cancel
Reply

Cancel

Children

245

NguyenTien posted over 10 years ago in reply to Hristo Anastasov

Hi Hristo, It worked out great. Thanks for your help ^^!!!
Cancel
Reply

Cancel
16310

Verified Answer
Offline Hristo Anastasov posted over 10 years ago in reply to NguyenTien

Hello Nguyen,

Please leave the return at line 63 and set the AutoSelectOnMatch property of the WebDropDown to false like this:

AutoSelectOnMatch="False"

Now you should be able to select blank item and if you do not the second item will be selected when there are two items in the list.

Please test it and let me know if it meets your requirements now. If you have any further questions, please do not hesitate to contact me, I will be glad to help.
Cancel
Reply

Reject Answer

Cancel
245

NguyenTien posted over 10 years ago in reply to Hristo Anastasov

Hi Hristo. Thank you for your answers

if i don't put return on line 63, i don't select blank item.

i want when i select blank item, the function must be stopped without regard to search results( the items in the dropdown) are two or more than two

Please help me fix that. Thank you!
Cancel
Reply

Cancel