How to search in a MULTISELECT ? (similar effect in MultiSelect ASPX)

**cmujica** · Nov 15, 2011, 7:09 PM

Hi all

I want search data in a MultiSelect (in the displayed list) , for example, the same effect in ComboBox when I press a key, the Combo located all data that begins with the key pressed. For ComboBox is a default effect but for MultiSelect how enable?

... the picture display the example of combobox effect, when I keypress appears all words with "t", I try the same effect with MultiSelecet.

Thank you

**ppalaciosm** · Nov 17, 2011, 6:11 PM

Hi, cmujica

Please, read this http://forums.ext.net/showthread.php...ED-MultiSelect

But this not an effect you need.

**cmujica** · Nov 18, 2011, 11:51 AM

thank you ppalaciosm, unfortunately the alternative solution of daniil does not work with many data, Consider the following picture

**cmujica** · Feb 15, 2012, 2:22 PM

Final solution of Daniil

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="mod_Test" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Ext.NET Example</title>
    <script type="text/javascript">
        var keyUpHandler = function (field, e) {
            MultiSelect1.view.clearSelections();
            var items = MultiSelect1.store.data.items,
                value = field.getValue(),
                i;
            for (i = 0; i < items.length; i++) {
                str = items[i].data.text;
                if (str.match("^" + value) == value) {
                    break;
                }
            }
            MultiSelect1.view.getNode(i).scrollIntoView();
            MultiSelect1.view.select(i);
        }
    </script>
</head>
<body>
    <form id="Form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Panel ID="Panel1" runat="server">
        <Items>
            <ext:TextField ID="TextField1" runat="server" EnableKeyEvents="true">
                <Listeners>
                    <KeyUp Fn="keyUpHandler" />
                </Listeners>
            </ext:TextField>
            <ext:MultiSelect ID="MultiSelect1" runat="server" Width="300" Height="100" >
                <Items>
                    <ext:ListItem Text="abc" Value="1" />
                    <ext:ListItem Text="abd" Value="2" />
                    <ext:ListItem Text="abe" Value="3" />
                    <ext:ListItem Text="aae" Value="4" />
                    <ext:ListItem Text="afd" Value="5" />
                    <ext:ListItem Text="kbc" Value="1" />
                    <ext:ListItem Text="kbd" Value="2" />
                    <ext:ListItem Text="kbe" Value="3" />
                    <ext:ListItem Text="kae" Value="4" />
                    <ext:ListItem Text="kfd" Value="5" />
                    <ext:ListItem Text="zbc" Value="1" />
                    <ext:ListItem Text="zbd" Value="2" />
                    <ext:ListItem Text="zbe" Value="3" />
                    <ext:ListItem Text="zae" Value="4" />
                    <ext:ListItem Text="zfd" Value="5" />
                </Items>
            </ext:MultiSelect>
        </Items>
    </ext:Panel>
    <asp:ListBox id="drop1" rows="3" runat="server" Width="300" Height="100">
    <asp:ListItem selected="true"></asp:ListItem>
                        <asp:ListItem Text="abc" Value="1" />
                        <asp:ListItem Text="abd" Value="2" />
                        <asp:ListItem Text="abe" Value="3" />
                        <asp:ListItem Text="aae" Value="4" />
                        <asp:ListItem Text="afd" Value="5" />
                        <asp:ListItem Text="kbc" Value="1" />
                        <asp:ListItem Text="kbd" Value="2" />
                        <asp:ListItem Text="kbe" Value="3" />
                        <asp:ListItem Text="kae" Value="4" />
                        <asp:ListItem Text="kfd" Value="5" />
                        <asp:ListItem Text="zbc" Value="1" />
                        <asp:ListItem Text="zbd" Value="2" />
                        <asp:ListItem Text="zbe" Value="3" />
                        <asp:ListItem Text="zae" Value="4" />
                        <asp:ListItem Text="zfd" Value="5" />
    </asp:ListBox>
    </form>
</body>
</html>

CLOSE!

**cmujica** · Feb 20, 2012, 11:14 AM

mmmm, the code works only for static elements, but when I populate the store from data base not works

MultiSelect Configuration

            <ext:TextField ID="TextField1" runat="server" EnableKeyEvents="true" >
                <Listeners>
                    <KeyUp Fn="keyUpHandler" />
                </Listeners>
            </ext:TextField>
            <ext:MultiSelect ID="MSCia_Transportes" runat="server" Width="219" Height="295" Legend="Cia. Transportes" StoreID="Store_cb_cia_transportes" DisplayField="des_ciatransportes" ValueField="cod_ciatransportes" Cls="myFont">
            </ext:MultiSelect>

JavaScript Code

<script type="text/javascript">
        var keyUpHandler = function (field, e) {
            var value = field.getValue();
            MSCia_Transportes.view.clearSelections();
            MSCia_Transportes.store.each(function (r, index) {
                if (r.get(MSCia_Transportes.displayField).match("^" + value) === value) {
                    MSCia_Transportes.view.getNode(index).scrollIntoView();
                    MSCia_Transportes.view.select(index);
                    return false;
                }
            });
        }
</script>

Other thread related SOLVED! --> http://forums.ext.net/showthread.php...ED-MultiSelect

Thread: How to search in a MULTISELECT ? (similar effect in MultiSelect ASPX)

Thread Tools

Search Thread

Display

How to search in a MULTISELECT ? (similar effect in LISTBOX ASPX)

Similar Threads

[CLOSED] Getting drag source MultiSelect when dragging item from MultiSelect to MultiSelect

Multiselect

get to Multiselect from javascript

Load second MultiSelect when select item in First MultiSelect

[FIXED] [0.8.2 / 1.0] MultiSelect Bug

Tags for this Thread

Posting Permissions

Sitemap

Downloads

Resources