- Joined
- May 20, 2008
- Messages
- 1
- Reaction score
- 0
i am trying to solve a problem to do with a drop down box in asp.net. currently when you click on the drop down it doesnt extend so not all of the text is visable. i have managed to get round this problem using css and a div tag although as you would expect this causes the dropdown box to become a paragraph of its own rather than on the one line with the few other dorp downs it works with.
if anyone knows of how to format the dropdown without using the div tag it be a great help. thanks.
css code:
<style type="text/css">
#wp {width:100px;overflow:hidden;border-right:1px solid gray;float:right}
</style>
drop down list my code should work on:
<div id="wp">
<asp
ropDownList ID="_LSTCOMPONENTTYPE" runat="server" BackColor="#FFFFC0" AutoPostBack="True"
DataSourceID="SqlDataSource1" DataTextField="LastName" DataValueField="LastName">
</aspropDownList><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:mybdConnectionString %>"
SelectCommand="SELECT [LastName] FROM [Person]"></asp:SqlDataSource>
</div>
full code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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 runat="server">
<title>Untitled Page</title>
<style type="text/css">
#wp {width:100px;overflow:hidden;border-right:1px solid gray;float:right}
</style>
</head>
<body>
<form id="form1" runat="server" >
<div class="os" style="width:100px;overflow:hidden;border-right:1px solid gray;">
<aspropDownList ID="DropDownList1" runat="server" >
<asp:ListItem>Test</asp:ListItem>
<asp:ListItem>aldfdlslsdkwele dslksd0id sldsids dldiels ddksow dlsiskd dsosoekd oeke</asp:ListItem>
<asp:ListItem>Another Test.</asp:ListItem>
</aspropDownList><br />
</div>
<br />
<br />
<asp:ImageButton ID="_BTNSUBMIT" runat="server" ImageUrl="edit_on.jpg" />
<aspropDownList id="_LSTTECHNOLOGYTYPE" runat="server" AutoPostBack="True" BackColor="#FFFFC0"
Height="24px" Width="56px">
</aspropDownList>
<div id="wp">
<aspropDownList ID="_LSTCOMPONENTTYPE" runat="server" BackColor="#FFFFC0" AutoPostBack="True"
DataSourceID="SqlDataSource1" DataTextField="LastName" DataValueField="LastName">
</aspropDownList><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:mybdConnectionString %>"
SelectCommand="SELECT [LastName] FROM [Person]"></asp:SqlDataSource>
</div>
<aspropDownList ID="_LSTWORKTYPE" runat="server" AutoPostBack="True" BackColor="#FFFFC0">
</aspropDownList>
<
<asp:TextBox ID="_TXTCOMPONENTDESC" runat="server" AutoPostBack="True" BackColor="#FFFFC0"
Width="248px"></asp:TextBox>
<aspropDownList ID="_LSTCOMPONENTBUILDCOMPLEXITY" runat="server" AutoPostBack="True"
BackColor="#FFFFC0">
</aspropDownList>
<nobr>
<asp:TextBox ID="_TXTCOMPONENTBUILDHOURS" runat="server" BackColor="#FFFFC0" ReadOnly="True"
Width="48px"></asp:TextBox><asp:ImageButton ID="_BTNDELETE" runat="server" AlternateText="Delete this component"
ImageUrl="icon_delete.gif" /></nobr><asp:Label ID="_LBLCOMPONENTID" runat="server"
Visible="False"></asp:Label><asp:Label ID="_LBLESTIMATEID" runat="server" Visible="False"></asp:Label><asp:Label
ID="_LBLSECTIONID" runat="server" Visible="False"></asp:Label>
<asp:Label ID="_JAVASCRIPT" runat="server"></asp:Label>
<script type="text/javascript">
function ExpandDDL(ddl) {
ddl.style.width = 'auto';
}
function CollapseDDL(ddl) {
ddl.style.width = '200px';
}
</script>
</form>
</body>
</html>
if anyone knows of how to format the dropdown without using the div tag it be a great help. thanks.
css code:
<style type="text/css">
#wp {width:100px;overflow:hidden;border-right:1px solid gray;float:right}
</style>
drop down list my code should work on:
<div id="wp">
<asp
ropDownList ID="_LSTCOMPONENTTYPE" runat="server" BackColor="#FFFFC0" AutoPostBack="True"DataSourceID="SqlDataSource1" DataTextField="LastName" DataValueField="LastName">
</asp
ropDownList><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:mybdConnectionString %>"SelectCommand="SELECT [LastName] FROM [Person]"></asp:SqlDataSource>
</div>
full code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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 runat="server">
<title>Untitled Page</title>
<style type="text/css">
#wp {width:100px;overflow:hidden;border-right:1px solid gray;float:right}
</style>
</head>
<body>
<form id="form1" runat="server" >
<div class="os" style="width:100px;overflow:hidden;border-right:1px solid gray;">
<asp
ropDownList ID="DropDownList1" runat="server" ><asp:ListItem>Test</asp:ListItem>
<asp:ListItem>aldfdlslsdkwele dslksd0id sldsids dldiels ddksow dlsiskd dsosoekd oeke</asp:ListItem>
<asp:ListItem>Another Test.</asp:ListItem>
</asp
ropDownList><br /></div>
<br />
<br />
<asp:ImageButton ID="_BTNSUBMIT" runat="server" ImageUrl="edit_on.jpg" />
<asp
ropDownList id="_LSTTECHNOLOGYTYPE" runat="server" AutoPostBack="True" BackColor="#FFFFC0"Height="24px" Width="56px">
</asp
ropDownList><div id="wp">
<asp
ropDownList ID="_LSTCOMPONENTTYPE" runat="server" BackColor="#FFFFC0" AutoPostBack="True"DataSourceID="SqlDataSource1" DataTextField="LastName" DataValueField="LastName">
</asp
ropDownList><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:mybdConnectionString %>"SelectCommand="SELECT [LastName] FROM [Person]"></asp:SqlDataSource>
</div>
<asp
ropDownList ID="_LSTWORKTYPE" runat="server" AutoPostBack="True" BackColor="#FFFFC0"></asp
ropDownList><
<asp:TextBox ID="_TXTCOMPONENTDESC" runat="server" AutoPostBack="True" BackColor="#FFFFC0"
Width="248px"></asp:TextBox>
<asp
ropDownList ID="_LSTCOMPONENTBUILDCOMPLEXITY" runat="server" AutoPostBack="True"BackColor="#FFFFC0">
</asp
ropDownList><nobr>
<asp:TextBox ID="_TXTCOMPONENTBUILDHOURS" runat="server" BackColor="#FFFFC0" ReadOnly="True"
Width="48px"></asp:TextBox><asp:ImageButton ID="_BTNDELETE" runat="server" AlternateText="Delete this component"
ImageUrl="icon_delete.gif" /></nobr><asp:Label ID="_LBLCOMPONENTID" runat="server"
Visible="False"></asp:Label><asp:Label ID="_LBLESTIMATEID" runat="server" Visible="False"></asp:Label><asp:Label
ID="_LBLSECTIONID" runat="server" Visible="False"></asp:Label>
<asp:Label ID="_JAVASCRIPT" runat="server"></asp:Label>
<script type="text/javascript">
function ExpandDDL(ddl) {
ddl.style.width = 'auto';
}
function CollapseDDL(ddl) {
ddl.style.width = '200px';
}
</script>
</form>
</body>
</html>