How to Set Tooltips in DropDown list in Asp.Net

Here we will see how to create tooltips in DropDownlist control in asp.net using JavaScript Code.

HTML CODE:

<div>

    <asp:DropDownList ID = "ddlCustomers" runat="server">

        <asp:ListItem Text="Please Select" Value="0" />

        <asp:ListItem Text="Umesh Patel" Value="1" />

        <asp:ListItem Text="Kiran Kumari" Value="2" />

        <asp:ListItem Text="Chirag Patel" Value="3" />

        <asp:ListItem Text="Jatin Patel" Value="4" />

    </asp:DropDownList>

    <script type="text/javascript">

        window.onload = function () {

            var ddlCustomers = document.getElementById("<%=ddlCustomers.ClientID %>");

            for (var i = 1; i < ddlCustomers.options.length; i++) {

                var title = "Customer ID: " + ddlCustomers.options[i].value;

                ddlCustomers.options[i].setAttribute("title", title);

            }

        };

    </script>

    </div>

OUTPUT:

Author : Umesh Patel

Related Posts