What's New?

[FIXED] [#20] Multiselect in Window - shift-click not captured correctly

Page 1 of 2 12 LastLast
  1. #1
    Nov 02, 2012, 8:28 PM

    [FIXED] [#20] Multiselect in Window - shift-click not captured correctly

    I am trying out the multiselect control for the first time and I'm having some problems with shift-click selection. When I shift-click, page elements and other elements inside the multiselect area are highlighted.

    This is using Ext.NET 2.0 with .NET runtime 4.0 in Internet Explorer 9.

    Here is an example:

    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack && !X.IsAjaxRequest)
        {
            for (int i = 0; i < 100; i++)
            {
                msItems.Items.Add(new Ext.Net.ListItem("Item #" + i.ToString(), i.ToString()));
            }
        }
    }
</script>


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test</title>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ResourceManager runat="server" ID="ResourceManager1" Theme="Gray" />
        <ext:Window runat="server" ID="window1" Height="400" Width="400" Layout="FitLayout">
            <Items>
                <ext:FieldSet runat="server" ID="fieldset1" Title="Test Items" Layout="FitLayout">
                    <Items>
                        <ext:MultiSelect runat="server" ID="msItems" MultiSelect="true" AutoScroll="true">
                        </ext:MultiSelect>
                    </Items>
                </ext:FieldSet>
            </Items>
        </ext:Window>
    </form>
</body>
</html>
    To reproduce, please click Item #0, then shift-click any other item. You should see something like this:

    Click image for larger version.  Name: ext-multiselect.png  Views: 187  Size: 5.8 KB  ID: 5020
    Last edited by fabricio.murta; Sep 15, 2017 at 6:41 PM.
  2. #2
    Nov 04, 2012, 5:05 AM
    Hello!

    Thank you a lot, it seems to be a bug or something else.

    Right now you can use the following overriding:

    <script type="text/javascript">
	Ext.override(Ext.ux.form.MultiSelect, {
		onSelectChange: function(selModel, selections){
			if (Ext.isIE)
				document.selection.empty();
		
			if (!this.ignoreSelectChange) {
				this.setValue(selections);
			}
		}

	});
</script>
  3. #3
    Nov 05, 2012, 6:03 AM
    Hi,

    Confirm. It seems to be reproducible in IE9 only (not tested lower IE).

    We are investigating a possible fix.
  4. #4
    Nov 05, 2012, 4:54 PM
    Hi,

    Thanks for the updates so far. For Baidaly, I added the override script to my test page inside an Ext.onReady method, but the issue was not resolved. Am I using that script correctly? Here is the updated example:

    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %><!DOCTYPE html>


<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack && !X.IsAjaxRequest)
        {
            for (int i = 0; i < 100; i++)
            {
                msItems.Items.Add(new Ext.Net.ListItem("Item #" + i.ToString(), i.ToString()));
            }
        }
    }
</script>


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test</title>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ResourceManager runat="server" ID="ResourceManager1" Theme="Gray" />
        <script type="text/javascript">
            Ext.onReady(function () {
                // fixes a bug in multiselect IE9
                Ext.override(Ext.ux.form.MultiSelect, {
                    onSelectChange: function (selModel, selections) {
                        if (Ext.isIE)
                            document.selection.empty();


                        if (!this.ignoreSelectChange) {
                            this.setValue(selections);
                        }
                    }


                });
            });
        </script>
        <ext:Window runat="server" ID="window1" Height="400" Width="400" Layout="FitLayout">
            <Items>
                <ext:FieldSet runat="server" ID="fieldset1" Title="Test Items" Layout="FitLayout">
                    <Items>
                        <ext:MultiSelect runat="server" ID="msItems" MultiSelect="true" AutoScroll="true">
                        </ext:MultiSelect>
                    </Items>
                </ext:FieldSet>
            </Items>
        </ext:Window>
    </form>
</body>
</html>
  5. #5
    Nov 05, 2012, 4:58 PM
    Update: I removed the onReady wrapper and the work-around cleared the selection after a moment.

    Question: why is it safe to put the script on the page in this manner? Is it the presence of the ResourceManager? I was afraid if I didn't use Ext.onReady Ext might not be defined when the script executed.
  6. #6
    Nov 05, 2012, 9:33 PM
    Quote Originally Posted by jwf View Post
    Update: I removed the onReady wrapper and the work-around cleared the selection after a moment.

    Question: why is it safe to put the script on the page in this manner? Is it the presence of the ResourceManager? I was afraid if I didn't use Ext.onReady Ext might not be defined when the script executed.
    Every script putted after ResourceManager tag will be executed after loading of Ext. Because if you will look in HTML source code of your page you will see that Ext defined in the head and your scripts in the body and browser loads and implements them consequently. It is safe if you understand how to use it and how it works.

    If you put after ResourceManager Ext.onReady it will not be called because this event already fired. You can try following code: 

    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test</title>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ResourceManager runat="server" ID="ResourceManager1" Theme="Gray" />
        <script type="text/javascript">
            Ext.onReady(function () {
                Ext.override(Ext.ux.form.MultiSelect, {
                    alert('onReady!');
                });
        </script>
    </form>
</body>
</html>
  7. #7
    Nov 05, 2012, 10:50 PM
    Ok thank you for explaining that. Regarding this thread, the workaround is fine for now but I hope there will be a more permanent solution soon. You can close or keep open the thread as you see fit.
  8. #8
    Nov 06, 2012, 4:58 AM
    I reported it to Sencha.
    http://www.sencha.com/forum/showthread.php?248030

    Probably, they will consider it a bug, but lets wait a bit.
  9. #9
    Nov 08, 2012, 9:49 AM
    Sencha opened a bug ticket.

    A workaround for now is setting DDReorder to true for the MultiSelect.
  10. #10
    Nov 08, 2012, 6:02 PM
    Yes! Thank you Daniil (& anonymous sencha drone) this totally resolves the issue for me, better than the script workaround since there is no momentary highlight. Thanks again.
Page 1 of 2 12 LastLast

Similar Threads

  1. Implement multiple columns sorting using Shift+Click
    By Strikers in forum 2.x Help
    Replies: 2
    Last Post: Dec 07, 2016, 1:42 PM
  2. [FIXED] [2.1] Reordered grid columns are not correctly updated in RowEditor
    By Svr77 in forum Bugs
    Replies: 4
    Last Post: Dec 08, 2012, 7:51 AM
  3. [FIXED] [1.1.0] IE6 FormLayout/With_UserControls example, icons not displayed correctly
    By akcsc in forum Bugs
    Replies: 4
    Last Post: Jul 28, 2011, 1:50 PM
  4. [CLOSED] [1.0] bug: KeyMap KeyBinding Alt/Ctrl/Shift not handled correctly
    By smmille1 in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Sep 07, 2010, 6:39 PM
  5. [FIXED] [V0.8.0] v0.7: RegexText on TextField not rendered correctly
    By jasonl in forum Bugs
    Replies: 1
    Last Post: Jan 21, 2009, 12:46 PM

Tags for this Thread

Posting Permissions