Help on sizing datalist ??

[Guest]

Dear all,

What is the best way to properly size a datalist item template in order
that any datatype fiits properly in ?

I have 5 columns inmy template, but could nit find proper rules for
dimension it properly.

How to use percent or pixel ?

Any help would be appreciate
regards
serge

 

[Nathan Sokalski]

What I have always done is set the Width property of the elements. Also, use
the ItemDataBound event to check to make sure that every element has
something in it's Text property (in order for the Width technique to work,
simply replace text values of "" with " "). Here is an example:


<asp:datalist id="datResults" runat="server" Width="725px" BorderWidth="2px"
BorderStyle="Outset" BorderColor="Silver">
<HeaderTemplate>
<asp:Label id="lblOrganization" runat="server" EnableViewState="False"
Width="300px">Organization</asp:Label>
<asp:Label id="lblName" runat="server" EnableViewState="False"
Width="150px">Name</asp:Label>
<asp:Label id="lblRegionHeader" runat="server" EnableViewState="False"
Width="100px">Region</asp:Label>
<asp:Label id="lblPhoneHeader" runat="server" EnableViewState="False"
Width="150px">Phone #</asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:HyperLink id=lnkOrganization runat="server" EnableViewState="False"
Width="300" text='<%# DataBinder.Eval(Container,"DataItem.organization") %>'
NavigateUrl='<%# DataBinder.Eval(Container,"DataItem.website") %>'
Target="_blank"></asp:HyperLink>
<asp:HyperLink id=lnkName runat="server" EnableViewState="False"
Width="150px" text='<%# DataBinder.Eval(Container,"DataItem.lname") + "," +
DataBinder.Eval(Container,"DataItem.fname") %>' NavigateUrl='<%#
DataBinder.Eval(Container,"DataItem.email","MAILTO:{0}") %>'
Target="_blank"></asp:HyperLink>
<asp:Label id=lblRegion runat="server" EnableViewState="False"
Width="100px" text='<%# DataBinder.Eval(Container,"DataItem.region")
%>'></asp:Label>
<asp:Label id=lblPhone runat="server" EnableViewState="False"
Width="150px" text='<%# DataBinder.Eval(Container,"DataItem.m_phone")
%>'></asp:Label>
</ItemTemplate>
</asp:datalist>

Notice that the Width of each element in the ItemTemplate is the same as the
Width of the corresponding element in the HeaderTemplate. Here is an example
of code you can use in the ItemDataBound event to replace Text="" with
Text="&nbsp;" :


Private Sub datResults_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataListItemEventArgs) Handles
datResults.ItemDataBound
If e.Item.ItemType = ListItemType.Item AndAlso
CType(e.Item.FindControl("lblPhone"), Label).Text = "" Then
CType(e.Item.FindControl("lblPhone"), Label).Text = "&nbsp;"
End Sub

Other fine-tuning cosmetic details can be done as well, but this should be
enough to get you started. If you have any questions, or would like to know
how to do something or know why something is happening, feel free to ask.
Good Luck!