Datalist items display when based on number of items - asp.net

I am using DataList control in ASP.net application. I have set
DataList1.RepeatColumns = 3;
DataList1.RepeatDirection = RepeatDirection.Horizontal;
properties of DataList. When item count is more than 3 it shows up properly. However if it is less than 3 it distorts and occupies whole space.
e.g. if there is only 1 item, it takes complete width and distorts UI.
if $$$ is one item, for 3 it shows like,
$$$|$$$|$$$
for one item it shows like
$$$$$$$$$$$
and UI disturbs completely.
Is there any way to format display in proper manner?

As lcarus mentionned, try setting ItemStyle-Width property. Here is a snippet which worked for me:
<asp:DataList ID="myDataList" runat="server" RepeatColumns="3" HorizontalAlign="Center" RepeatLayout="Table" RepeatDirection="Horizontal">
<ItemStyle Width="33%" />
<ItemTemplate>
<your code here>
</ItemTemplate>
</asp:DataList>
When requiring 3 columns, set the column width to 33%.

Try setting the ItemStyle-Width property to the desired width. I would expect it to set the width of each item to the exact size you set it to: Here's a link to MSDN documentation: http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.datalist.itemstyle.aspx

Related

Cant change width of telerik:RadComboBox

Using Telerik RadComboBox for asp.net. Having trouble setting the width of the control. No matter what I change the width do it doesn't have any effect....
<telerik:RadComboBox RenderMode="Classic" Skin="Default"
EnableBrowserButtonStyle="true"
ID="ddlSelectedItems" runat="server" CheckBoxes="true"
EnableCheckAllItemsCheckBox="true"
Width="245px" Label="" />
Any suggestions?
Unfortunately, the RadComboBox always sets its width to 100%, no matter what you set the Width property to. The only way I could find to work around this is to wrap the control in a tag with a display attribute of either block or inline-block, and put the width style on the wrapper (or use a class to apply the width).
<div style="width: 245px;">
<telerik:RadComboBox RenderMode="Classic" Skin="Default"
EnableBrowserButtonStyle="true"
ID="ddlSelectedItems" runat="server" CheckBoxes="true"
EnableCheckAllItemsCheckBox="true"
Label="" />
</div>
Can you set the RenderMode property to Lightweight and test again:
This works on my side.

How to put an Vertical scrollbar within asp:Repeater ItemTemplate?

I have inherited an .ascx control that consists of an asp:repeater construct containing a HeaderTemplate, an ItemTemplate and an empty FooterTemplate.
Both the header and the item templates are linked to a data source.
My question is simply this, I want to have a vertical slider applied to the ItemTemplate such that I can scroll up and down the items contained within whilst the HeaderTemplate remains static.
I have tried using an asp:Panel within the ItemTemplate but this doesn't render the row within the template.
I've resorted to encapsulating the whole of the asp:Repeater within an asp:Panel that specifies a vertical scrollbar. This works but scrolls the header out of view if the number of rows in the ItemTemplate is large.
If anyone can help and suggest a way forward I would be most grateful.
It can be done in a simple manner with some CSS tricks e.g.
Repeater Item Template Markup
<HeaderTemplate>
<div class="template">
</HeaderTemplate>
<ItemTemplate>
Your Stuff
</ItemTemplate>
<FooterTemplate>
</div>
</FooterTemplate>
CSS Defined for "template"
.template {
height: 200px;
overflow-y: scroll;
}
Hope this will help !!

Aspxgridview : How to change the header caption width so it will fits the columns width?

I have the following problem: on runtime I am changing the name of the columns caption (the grid is linked to a table and I don't want the user to see their original name). However I have one header caption which is too long - "Total Number of votes" which actually represents an integer not bigger than 4 digits. My question is how I can fix the header caption width ... in my case I want it to appear on two lines?
If you want column caption to wrap set column HeaderStyle.Wrap to True.
<dxg:ASPxGridView runat="server">
<Columns>
<dxg:GridViewDataColumn FieldName="Test" VisibleIndex="1" >
<HeaderStyle Wrap="True"/>
</dxg:GridViewDataColumn>
</Columns>
</dxg:ASPxGridView>
you can add property ItemStyle-Width="your value"
Example for bound field
<asp:BoundField DataField="" HeaderText="" ItemStyle-Width="150"/>

fixed gridview size with images asp.net

I have a GridView with an ImageField and a ButtonField in it.
The Image is large .. but i want it to be displayed in a smaller size in the grid.. so I'm looking for a way to fix the cell size of my GridView.
How can I do this?
I had the same problem; solved it this way:
<asp:ButtonField ButtonType="Image" CommandName="EliminarFuente" HeaderText="Eliminar" ImageUrl="~/Themes/Images/Delete.png" >
<ControlStyle CssClass="BotonDeImagen"/>
<ItemStyle HorizontalAlign="Center" />
</asp:ButtonField>
The CSS class is like this:
.BotonDeImagen
{
width:25px;
height:25px;
}
and the result is a centered image of 25*25 pixels.
Alternative solution:
You could define height and width on the ControlStyle tag, instead of using a CSS class.
You can make set HighQualityBicubic InterpolationMode when you do the BinaryWrite
Checkout this example code.
Try using these two properties on your ImageField.
ItemStyle-Width=""
ItemStyle-Height=""
Explicity set the height and width of the image. Use CSS to control the size of the rendered tags.

set the height of freetextbox

How should I go about setting the height of freetextbox? I want to size the textbox reasonably based on the lenght of the text in the textbox.
simply set the height property of textbox as much you want... like..
<FTB:FreeTextBox ID="txtDesc" runat="server" Width="590px" Height="300px" ></FTB:FreeTextBox>

Resources