Browser automation for 'select2' dropdown (search and select)

[MilenP]

Hello guys,

I want your advise here. I have a select2 dropdown menu that have to make automation on. I have tried with:

;$jQuery('#s2id_company_id').select2("val", "16013").trigger('change.select2');

but it is not working correctly... It is selecting the value, but there is something like AJAX that is making changes after selecting something from the dropdown, Example:

 

 

after:

Automatically changed:

 

 

You can see the html of it below:

 

 

Currently in order to work I am doing the following:

 

$jQuery('#s2id_company_id').select2('search', $CompanyName)         ; Search by Company
        Sleep(2000)
        _ClickSearchedValueSelect2()
        Sleep(1500
        
        
        
        
    Func _ClickSearchedValueSelect2()

    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:1]", "{ENTER}")
    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:9]", "{ENTER}")

    Sleep(1500)

    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:1]", "{TAB}")
    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:9]", "{TAB}")

EndFunc   ;==>_ClickSearchedValueSelect2

 

The above is working, but when the automation using the ControlSend is working, who is using it will not be 100% able to work on the PC because the focus from the windows they will be working on will be taken in some point.

Can someone advise how is the best way of doing the select2 item selection with triggering the changes after it ?

 

Thank you guys,

 

Milen

 

[Danp2]

Have you tried either of the following? --

$jQuery('#s2id_company_id').select2("val", "16013").trigger('changed')

$jQuery('#s2id_company_id').select2("val", "16013", "triggerChange", true)

 

[MilenP]

@Danp2, You are my hero... I knew that you would help
 

$jQuery('#s2id_company_id').select2("val", "16013", "triggerChange", true)

 

is working, Thank you !

[MilenP]

I have another question, as most likely because there is minimum characters to input  before the list is viewed:

I am not able to change some values with the above. Could you please advise of a workaround ?

 

[Danp2]

Unfortunately, my crystal ball has stopped working, so you'll need to provide more details so that we can better understand the issue .

Is there a website where we can observe this? For example, can you replicate the issue on one of the examples here? Also, show us your code.

[MilenP]

The dropdown I have issues with is exactly like this one:

 

but unfortunately I cannot reproduce the issue from the website you provided, because the script just hang when try to.

What I use now is 

$jQuery('#s2id_company_id').select2('search', $CompanyName)         ; Search by Company
        Sleep(2000)
        _ClickSearchedValueSelect2()
        Sleep(1500
        
        
        
        
    Func _ClickSearchedValueSelect2()

    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:1]", "{ENTER}")
    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:9]", "{ENTER}")

    Sleep(1500)

    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:1]", "{TAB}")
    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:9]", "{TAB}")

EndFunc   ;==>_ClickSearchedValueSelect2

and it is working, but I want to start doing it the way you suggested:

 

$jQuery('#s2id_company_id').select2("val", "16013", "triggerChange", true)

which is working for the fields without minimumInputLength

Thank you again for your assistance, much appreciated!

 

[Danp2]

13 minutes ago, MilenP said:

but unfortunately I cannot reproduce the issue from the website you provided, because the script just hang when try to.

Please post this code so that I may try it.

[MilenP]

Hi again @Danp2,

 

I have reproduced it form the site you gave me, you can see the example code below:

 

#include <IE.au3>


Global $oIE = _IEAttach("http://select2.github.io/select2/", "url")

Local $jQuery = _jQuerify($oIE)

$jQuery('#s2id_e3').select2("val", "Alaska", "triggerChange", true)

 

The above code is working, it is changing the value to Alaska, when it is something else, for example Oregon. But, when it is Alaska, I cannot change ti to anything else.

 

#include <IE.au3>


Global $oIE = _IEAttach("http://select2.github.io/select2/", "url")

Local $jQuery = _jQuerify($oIE)

$jQuery('#s2id_e3').select2("val", "Oregon", "triggerChange", true)

The above is not changing to Oregon when it is on something else, Alaska for example.

 

Maybe there is some other way to work with this kind of select2 fields with minimumInputLength  set, I hope you will advise me what to do

Thank you,

Milen

 

[Danp2]

You are using the wrong values. Try this --

#include <IE.au3>

Global $oIE = _IECreate("http://select2.github.io/select2/", 1)
Local $jQuery = _jQuerify($oIE)

$jQuery('#s2id_e3').select2("val", "OR", "triggerChange", true)
Sleep(1000)
$jQuery('#s2id_e3').select2("val", "FL", "triggerChange", true)
Sleep(1000)
$jQuery('#s2id_e3').select2("val", "TN", "triggerChange", true)

 

[MilenP]

Hi @Danp2,

 

I have asked the website admins about the select2 dropdowns I have issues with, and they told me that:

 

Quote

Is because the second one uses a dynamic search (where the results are fetched from the server based on user input), whereas the first one has all the results preloaded (which is why it's so slow). So you can manually change the value of the pre-loaded version but not the dynamic load version which requires "searching".

 

 

My question to them was why on some of their select2 dropdowns I can directly select with

$('#s2id_e3').select2("val", "Alaska", "triggerChange", true)

but on another I can't and as a workaround I am using 

 

$jQuery('#s2id_company_id').select2('search', $CompanyName)         ; Search by Company
        Sleep(2000)
        _ClickSearchedValueSelect2()
        Sleep(1500
        
        
        
        
    Func _ClickSearchedValueSelect2()

    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:1]", "{ENTER}")
    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:9]", "{ENTER}")

    Sleep(1500)

    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:1]", "{TAB}")
    ControlSend("Terminal", "", "[CLASS:Internet Explorer_Server; INSTANCE:9]", "{TAB}")

EndFunc   ;==>_ClickSearchedValueSelect2

 

@Danp2, as you have a lot of experience with similar things, can you please advise me if really there is a better way of selecting the values when they are fetched from the server based on user input.

 

Thank you,

Milen

 

[Danp2]

Unless you can find another website that allows us to observe this behavior, then the only suggestion I would give is to use the debugging tools in Firefox or Chrome to try to identify a way to accomplish your goal using javascript. If you find a way, then you can generally convert that into something usable in Autoit.