ListView styling - c#

I am currently fighting against a Listview, I'm trying to have two images (with headlines on etc.) beside each other, but I can't figure it out.
My code looks like this:
<asp:ListView runat="server" ID="LWArticleList">
<ItemTemplate>
<table id="TableArticleList" class="repclass">
<tr>
<td>
<div class="thumb main">
<p class="thumb-comment">
<asp:HyperLink ID="CommentHyperLink" runat="server" CssClass="comment-count">10</asp:HyperLink></p>
<asp:HyperLink ID="ArticleLink" runat="server" NavigateUrl='<%# string.Format("~/Article.aspx?id={0}", Eval("ID")) %>'>
<asp:Image ID="Image1" Width="250px" Height="170px" runat="server" ImageUrl='<%# string.Format("{0}/{1}", ImageService.ImageLocation, Eval("Image")) %>' />
</asp:HyperLink>
<div class="thumb-title">
<h2><asp:HyperLink ID="LinkTitle" runat="server" Text='<%# Eval("Headline") %>' /></h2>
<p><asp:Literal ID="LitSummary" runat="server" Text='<%# Eval("Summary") %>' /></p>
</div>
</div>
</td>
</tr>
</table>
</ItemTemplate>
</asp:ListView>
I wish my content to be shown like this:
Article 1 | Article 2
Article 3 | Article 4
But at the moment mine looks like this:
Article 1
Article 2
Article 3
Article 4
How can I change this?

It could be because you only have one table cell <td> so this will only ever be a 1 column listview.
For example, to display a two-column table, you would render three table cells (<td>) in each table row (<tr>), like so:
<table ...>
<tr>
<td>Article 1</td>
<td>Article 2</td>
</tr>
...
<tr>
<td>Article N - 1</td>
<td>Article N</td>
</tr>
</table>

You are displaying your data in a table for each item in your data source. You should rethink that approach.
Tables' display property is block by default, so this is why your items display as they do.

Related

Unusable elements inside the (list view ) asp.net

Why can't I use the (input) I put in my (list view) in the C # code field?
<asp:ListView ID="ListV" runat="server">
<ItemTemplate runat="server">
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
<tr class="text-center">
<td class="product-remove"></td>
<td class="image-prod">
<div class="">
<asp:Image ID="Image1" CssClass=" img" ImageUrl='<%# "../img/" + Eval("picture")
%> ' runat="server" />
</div>
</td>
<td class="product-name"><%# Eval("namebook") %> </td>
<td class="price"><%# Eval("Price") %> </td>
<td class="quantity"><%# Eval("titel") %></td>
<td class="col-2">
<asp:Button ID="delete" CssClass="btn btn-outline-danger" CommandArgument='<%#
Eval("id")%>' OnClick="delete_Click" runat="server" Text="حذف کالا" />
</td>
<td>
<input id="quantity2" runat="server" type="number" value="1" min="1" max="20" />
</td>
</tr>
</ItemTemplate>
</asp:ListView>
You want a server control there. Additionally, this control only exists as part of an item template, meaning there isn't just one control named quantity2... there could be many, depending on the data source. Therefore referencing it just by name is not good enough. And speaking of data sources, depending on how you handle this the databinding may not have taken place yet at the time the Page_Load code runs, meaning the input control doesn't exist at all.
So the real question is: what do you want to do with this input?
CodeBehind="~/ (Page Name) .aspx.cs"

how to display a single column values in multiple columns in gridview

I display the list of table names when a particular database is selected from the drop down list. Number of tables in my database is more than 100. I don't want to display it as a single column and scroll the page. I want to display it as a table. Also each table name is a link to view its corresponding table details. can anyone help me with the technique to achieve it ?
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table border="1">
<tr>
<td colspan="5">
Tables
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<%--<tr>--%>
<td><asp:Label ID="lbl_TableName" runat="server" Text='<%#Eval("table_name")%>' /></td>
<%-- </tr>--%>
</ItemTemplate>
<%-- <SeparatorTemplate>
<td colspan="4"> name</td>
</SeparatorTemplate>--%>
<%-- <AlternatingItemTemplate>
<td> break</td>
</AlternatingItemTemplate>--%>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>

Creating a ListView Control in Default Edit Mode

I have a ListView Control in Asp.net 4.0 C#
I am attempting to make the default mode = Edit Mode with text boxes. So I took the Item Template (the default template) and replaced my databound labels with TextBoxes.
It works ok. Except the text Boxes only apply to every other row. So half the rows are text boxes on Page Load and half the Roes are still Labels. Here is my code:
<ItemTemplate>
<tr style="">
<td>
<asp:Label ID="TitleLabel" runat="server" Text='<%# Eval("Title") %>' />
</td>
<td>
<asp:TextBox ID="DiscountPercentageTextBox" runat="server"
Text='<%# Bind("DiscountPercentage") %>' />
</td>
<td>
<asp:TextBox ID="CashTextBox" runat="server" Text='<%# Bind("Cash") %>' />
</td>
</tr>
</ItemTemplate>
<LayoutTemplate>
<table>
<thead>
<tr>
<th>Title </th>
<th>DiscountPercentage</th>
<th>Cash</th>
</tr>
</thead>
<tbody>
<asp:PlaceHolder runat="server" ID="itemPlaceholder" />
</tbody>
</table>
</LayoutTemplate>
And here is the result:
You see? Every other row is a textbox. I need all rows to be textboxes. What am i doing wrong?
Huh, do you have an AlternatingItemTemplate defined? The ListVIew has no intelligence to make the original fields as labels....
Try making the ALternatingItemTemplate as the ItemTemplate too, if you don't have one defined.

ListView Multiple Delete (CheckBox)

sorry in advance I have searched the whole site but I can not find an answer to this question
I plan to use the listview with checkboxes in every item and one delete button so that I can do a removal to multiple row at once, is there any way that I can start this work?
this is my current code
<asp:ListView ID="ListInbox" runat="server" DataKeyNames="MessageID"
DataSourceID="LinqDataSourceInbox" >
<EmptyDataTemplate>
There is no message
</EmptyDataTemplate>
<ItemTemplate>
<table runat="server">
<tr runat="server">
<td runat="server">
<asp:CheckBox ID="CheckBoxSelect" runat="server" />
</td>
<td runat="server">
<asp:Panel ID="PanelMsg" runat="server" Width="400px">
<a href='UserProfile.aspx?UserName=<%# Eval("FromUserName") %>'><img src="ProfilePic/<%#Eval("User.ProfilePic") %>" alt='' width="25" /></a>
<a href='UserProfile.aspx?UserName=<%# Eval("FromUserName") %>'><%# Eval("FromUserName") %></a>
write you message:
<a href='ViewMessages.aspx?MsgID=<%# Eval("MessageID") %>'><%# Eval("Subject") %></a>
<%# Eval("MessageTime") %>
</asp:Panel>
</td>
</tr>
</table>
<hr style="text-align:left; width:400px;" />
</ItemTemplate>
<LayoutTemplate>
<div style="min-height:450px;">
<div runat="server" id="itemPlaceholder">
</div>
</div>
</LayoutTemplate>
</asp:ListView>
The questions are
Where the CheckBox put? Selected/Item template?
Where the Delete Button put? Inside/Outside ListView?
Thx in advance..
We do smth similar with a GridView backed with a DataTable, I suppose I can give you a general idea and you can do smth similar.
Create a flag column/ field. e.g: User.SetToDelete
onCheckChanged set this flag to true.
Upon Click of the delete button, iterate the rows and look for items set to be deleted.
As for the suggestion for a simple GUI:
Hope it helps.

Read textbox from ASP.net page that repeated n times

I have an asp.net web page that's has a number of controls that are repeated according to number of records retrieved from the database, and I wanna read the values of those text boxes after users enter values in them, so please if anyone can help me on this issue.
I have an example of my work
<% System.Data.SqlClient.SqlDataReader myDReader = myDatabaseConnector.getDataFromDBAsSQLDataReader("SELECT * from students);
while(myDReader.Read())
{ %>
<asp:TextBox ID="txtCourseInfo" Test="" EnableViewState="false" CssClass="dataEntrySearchDataText" ReadOnly="true" runat="server"></asp:TextBox>
<% } %>
This a sample of what I have mean from my question in which I want to retrieve the value of txtCourseInfo in my C# code behind
You could use a Repeater to do this:
<asp:repeater id="rptCourses" runat="server" DataSourceID="dsCourseInfo"
<ItemTemplate>
<asp:TextBox ID="txtCourseInfo" Text='<%#Eval("StudentName")#%>' EnableViewState="false" CssClass="dataEntrySearchDataText" ReadOnly="true" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:Repeater>
<asp:sqldatasource id="dsCourseInfo"
ConnectionString="<%$ ConnectionStrings:YourConnectionString %>"
Select Command="Select * from Students">
</asp:sqldatasource>
That's all you need. from code behind you can iterate through the controls on the repeater and grab the information.
Notice the Eval expression on the text field. I used "StudentName" as an example, but you should use one of the column names returned by the select statement
Additional comments:
Don't do select * from ... It's a bad practice in many respects. Always specify the columns you need, even if you need all.
I realize that you disable viewstate on the textbox. I don't know the reason for doing this but be aware that the info won't be persisted on subsequent postbacks unless you enable it on the control.
UPDATE
Yes, you can have tables inside repeaters. Look at the example below:
<ItemTemplate>
<table runat="server" style="color: White; background-color: #3A4F63;" visible="false"
id="headerTable">
<tr>
<td colspan="3" align="center">
<asp:Label ID="headerTitle" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td style="width: 200px; background-color: #3A4F63; color: White;">
Image
</td>
<td style="width: 200px;">
Studen Name
</td>
<td style="width: 200px;">
Birth Date
</td>
</tr>
</table>
<table>
<tr>
<td style="width: 200px;">
<asp:Image ID="img" runat="server" ImageUrl='<%#Eval("ImageUrl") %>'></asp:Image>
</td>
<td style="width: 200px;">
<asp:Label ID="lblName" runat="server" Text='<%#Eval("Name") %>'></asp:Label>
</td>
<td style="width: 200px;">
<asp:Label ID="lblBirthDate" runat="server" Text='<%#Eval("BirthDate") %>'></asp:Label>
</td>
</tr>
</table>
</ItemTemplate>

Categories

Resources