Click here to Skip to main content
15,881,882 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I have a drop down list and due to its small width, in IE the words are cutting , i want to show them when the mouseover on the ddl items using javascript .
Posted
Updated 30-Oct-12 21:14pm
v2
Comments
Sandeep Mewara 31-Oct-12 3:14am    
Good idea. Now, what is the issue? where are you stuck when you tried?
Vimalrashamra 31-Oct-12 4:13am    
i am not getting the tooltip with the items value
Niral Soni 31-Oct-12 11:51am    
Add "tooltip" attribute to every option tag (rather then providing it only on the "select" tag)

Finally here is ur soln.,

If you don’t consider the users who are using IE 6.0, the solution is to set title attribute for each list item.
If u want to show selected item in Dropdownlist's tool tip, then add the following script block.. Otherwise No need to use the following script and no need to call it in onchange event..
XML
<script type="text/javascript">
        function showTip(ddl) {
            document.getElementById("DropDownList1").title = ddl;
        }
    </script>

XML
<asp:DropDownList ID="DropDownList1" runat="server"  onchange="showTip(this.value)" ToolTip="Dhi">
            <asp:ListItem title="Dhi" Selected="True">Dhi</asp:ListItem>
            <asp:ListItem title="sa">sa</asp:ListItem>
            <asp:ListItem title="boy">boy</asp:ListItem>
            <asp:ListItem title="girl">girl</asp:ListItem>
        </asp:DropDownList>



if you want to implement the tooltip for dropdownlist control in IE 6.0, the soln. posted above by me is the only answer i hope...

For any clarifications reply to this..
Mark it if u find this useful...
 
Share this answer
 
v4
Hi, i hope this solves the problem....

XML
<script type="text/javascript">
        function showTip(ddl) {
            document.getElementById("DropDownList3").title = ddl;
        }
    </script>


XML
<div>
           <asp:DropDownList ID="DropDownList3" runat="server" onchange="showTip(this.value)" ToolTip="Dhi">
               <asp:ListItem Selected="True">Dhi</asp:ListItem>
               <asp:ListItem>sa</asp:ListItem>
               <asp:ListItem>boy</asp:ListItem>
               <asp:ListItem>girl</asp:ListItem>
           </asp:DropDownList>
       </div>


For any clarifications reply to this..
Mark it if u find this useful...
 
Share this answer
 
Comments
Vimalrashamra 31-Oct-12 4:13am    
not working ........thanks by the way
satz_770 31-Oct-12 5:46am    
wat is the problem u r getting.. pls explain... because i gave this soln. only after testing in my local env....
Vimalrashamra 31-Oct-12 6:52am    
its not about showing the text on the dropdown list ....... you just take tooltip and show dhi on that ........ thats not my query ....... i want to show the text on which mouse over ..... like when mouse is over the "Boy" tooltip will show the "Boy" .............now check your solution and its result
satz_770 1-Nov-12 1:54am    
sorry, i dint understood ur requirement clearly... now i have given a soln., hope tat wil suit ur req., check it...
try this,

XML
<script type="text/javascript">
        function dropDwnToolTips(id) {
            if (id.value == 0) {
                id.title = "";
            }
            else {
                id.title = id.value;
                }
        }
    </script>



<asp:DropDownList
ID="ddlname" CssClass="form" runat="server" AutoPostBack=""
onmouseover="dropDwnToolTips(this)"/>
 
Share this answer
 
v4

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900