Home › Forums › Porto Admin – Responsive HTML5 Template › Select2 in Modal with Safari and Chome Mobile
- This topic has 5 replies, 2 voices, and was last updated 5 years, 3 months ago by Support2. This post has been viewed 4460 times
-
AuthorPosts
-
December 20, 2018 at 4:53 am #10028100lucianopenaParticipant
Dear,
When I use a Select2 in a Modal, accessing by any mobile with Safari ou Chrome, the search input does not work. The inputbox, show correctly but I cant do the search.
Template Version: 2.1.1December 20, 2018 at 5:34 am #10028101Support2KeymasterHello,
We made a test here using a iPhone X + Safari: http://www.okler.net/tests/adm2/HTML/ui-elements-modals.html (on the “Basic” modal) and couldn’t reproduce the issue. Please send an online link of your website showing the issue, so we can inspect your code, make tests and send the solution for you.
Kind Regards,
Rodrigo.
December 20, 2018 at 6:03 am #10028102lucianopenaParticipantRight.
I do a test and this example really works in Safari using Iphone, but, in this example the select2 is a multiple. When I change my select2 to multiple works to, but, I cant use multiple in this case.
Watch my select2<div class=”form-group row”>
<label class=”col-md-2 control-label “>Vendedor</label>
<div class=”col-md-10″>
<select name=”f_vendedor” data-plugin-selectTwo class=”form-control populate”>
<optgroup label=”salesman”>
</optgroup>
</select>
</div>
</div>
December 20, 2018 at 10:32 pm #10028107Support2KeymasterHello,
Thanks now we can reproduce the issue.
You need use the option “dropdownParent” of Select2, please follow the steps below:1) Change the select html to:
<select name="f_vendedor" class="form-control populate">
2) Initialize the select2 plugin manually, for it add in (js/custom.js):
$('select[name="f_vendedor"]').select2({ theme: 'bootstrap', dropdownParent: $('#modalBasic') // #modalBasic is the ID of modal });
Please, try that and let us know if you need further assistance.
Kind Regards,
Rodrigo.
December 21, 2018 at 12:00 am #10028111lucianopenaParticipantI try this, but, when I remove the “data-plugin-selectTwo” of the select2, this change to a simples combobox without search input.
See bellow:This is corret (but the input does not work)
https://www.ancoranet.com.br/prowebplus/erros/cwis.pngwhithout input-box (error) in chome:
https://www.ancoranet.com.br/prowebplus/erros/cwtis.pngwhithout input-box (error) in safari:
https://www.ancoranet.com.br/prowebplus/erros/swtis.pngOn Desktop, Works anyways, with or without data-plugin-selectTwo and Initialize select2 manually
December 21, 2018 at 5:17 am #10028115Support2KeymasterHello,
We made a test with our last solution and it’s working:
You can test here: http://www.okler.net/tests/adm2/HTML/ui-elements-modals.html (basic modal). Clear the browser cache before test.
Seeing your screenshots, seems that the select2 are not initializing. Probably the reason is some javascript error (check the console of browser) or maybe you need clear your browser cache to get the JS code working.
If possible create a test login for us in your system and send the link of your site, so we can inspect your code and help you with that.
Kind Regards,
Rodrigo.
-
AuthorPosts
This topic is marked as "RESOLVED" and can not rceive new replies.