[OPEN] [#1868] DropDownField with ColorPicker not work in Safari

  1. #1

    [OPEN] [#1868] DropDownField with ColorPicker not work in Safari

    Hi,
    see my example, in Safari I can't select the color in to the colorpicker.
    Thanks

    Jimmy

    <%@ Page Language="C#" %>
    
    
    <!DOCTYPE html>
    
    
    <html>
    <head runat="server">
        <title></title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    
    
        <script type="text/javascript">
            var onSelect = function (cp, color) {
    
    
                var ddfield = cp.ownerCt.dropDownField, colore = "#" + color;
    
    
                if (color == '000000') {
                    ddfield.setValue('black');
                }
                else {
                    ddfield.setValue(colore);
                }
    
    
                ddfield.validate();
            };
        </script>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:Panel ID="pnlContainer" runat="server" Height="400" Width="600">
                <Items>
                    <ext:DropDownField ID="ddColor" IDMode="Static" runat="server" Editable="false" AllowBlank="true" EnableKeyEvents="true"
                        Width="210">
                        <Component>
                            <ext:Panel ID="pnlColorPalette" runat="server">
                                <Items>
                                    <ext:ColorPicker ID="colorPalette" IDMode="Static" runat="server">
                                        <Listeners>
                                            <Select Fn="onSelect" />
                                        </Listeners>
                                    </ext:ColorPicker>
                                </Items>
                            </ext:Panel>
                        </Component>
                    </ext:DropDownField>
                </Items>
            </ext:Panel>
        </form>
    </body>
    </html>
  2. #2
    Hello Jimmy!

    Thanks for reporting the issue, we could reproduce it here by loading the sample with BigSur's Safari.

    Maybe a simple way to avoid this issue is not using the DropdownField at all, but the specialized <ext:ColorField />, which allows for a more flexible color selection, but may be too big and complex to fit the desired user experience.

    If you still want a simple color picker, try adding the ClickEvent="tap" so the event Safari (and perhaps other mobile clients) pass are caught as selection by the color picker. In the tests here, desktop browsers also triggered the selection even when this was configured.

    We have logged issue after #1868 and will post an update here as soon as we make a definitive fix into Ext.NET.

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Hi Fabricio,
    I have applied ClickEvent="tap" and works fine in all browsers.
    Thank you very much

    Jimmy
  4. #4
    Thanks for the feedback, glad one of the alternatives worked for you!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. Replies: 5
    Last Post: Nov 04, 2016, 3:31 AM
  2. Replies: 18
    Last Post: Aug 16, 2013, 3:40 AM
  3. [CLOSED] Difference layout Safari Ipad vs Safari PC
    By CarWise in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Feb 05, 2013, 3:52 AM
  4. [CLOSED] Help with window.open and directevent in safari
    By Pablo_Azevedo in forum 1.x Legacy Premium Help
    Replies: 8
    Last Post: Aug 10, 2011, 8:16 PM
  5. Replies: 4
    Last Post: Aug 31, 2009, 12:10 PM

Posting Permissions