How to multiple select item in ListBox without press CTRL in Asp.Net?

385
November 23, 2016, at 7:58 PM

I want to select multiple items in ListBox, but the browser requires the user to press CTRL to select multiple items otherwise it selects just one item.

I want to select multiple items without pressing CTRL, and I don't want to use CheckBoxList. Is there any better way of doing it? Using pure javascript, or JQuery or Codebehind.

(I already added SelectionMode="Multiple" attributes to ListBox controls)

Code:

    <asp:ListBox ID="ListBox1" runat="server" Height="210px" Width="203px" SelectionMode="Multiple">
        <asp:ListItem>1000</asp:ListItem>
        <asp:ListItem>2000</asp:ListItem>
        <asp:ListItem>4000</asp:ListItem>
        <asp:ListItem>4000</asp:ListItem>
        <asp:ListItem>5000</asp:ListItem>
        <asp:ListItem>6000</asp:ListItem>
    </asp:ListBox>
Answer 1

Ref: Making a standard ASP.NET listbox do multiselect without holding Ctrl

Just change your listbox to

<asp:ListBox ID="ListBox1" runat="server" Height="210px" Width="203px" SelectionMode="Multiple" onclick="ListBoxClient_SelectionChanged(this, event);">
        <asp:ListItem>1000</asp:ListItem>
        <asp:ListItem>2000</asp:ListItem>
        <asp:ListItem>4000</asp:ListItem>
        <asp:ListItem>4000</asp:ListItem>
        <asp:ListItem>5000</asp:ListItem>
        <asp:ListItem>6000</asp:ListItem>
</asp:ListBox>

And add following script in your <script> tag

<script type="text/javascript" language="javascript">
        var selectedClientPermissions = [];
        function pageLoad() {
            var ListBox1 = document.getElementById("<%= ListBox1.ClientID %>");
            for (var i = 0; i < ListBox1.length; i++) {
                selectedClientPermissions[i] = ListBox1.options[i].selected;
            }
        }
        function ListBoxClient_SelectionChanged(sender, args) {
            var scrollPosition = sender.scrollTop;
            for (var i = 0; i < sender.length; i++) {
                if (sender.options[i].selected) selectedClientPermissions[i] = !selectedClientPermissions[i];
                sender.options[i].selected = selectedClientPermissions[i] === true;
            }
            sender.scrollTop = scrollPosition;
        }
</script>
READ ALSO
Multiple JavaScript timeout popups that are only displayed if previous popup has been closed

Multiple JavaScript timeout popups that are only displayed if previous popup has been closed

I have a page that times out a session after an hour. I need to display a popup alert at 45 minutes then every minute from 50 - 60 using JavaScript or jQuery (I don't know jQuery, but it's available).

287
implementing a JQuery function to trigger an event every time a DropDownList is selected

implementing a JQuery function to trigger an event every time a DropDownList is selected

i am new to the concept of MVC and JQuery i am stuck here please help.

237
How to clear stored local storage value if the user open second html page independently

How to clear stored local storage value if the user open second html page independently

Working on local storage using jQuery. I have two pages.

240
Frame removed from DOM - is there a better way?

Frame removed from DOM - is there a better way?

I am trying to get rid of my video playing in the background after closing the popup. Right now what I have is this:.

255