To put it as simple as I can. I have a website and the homepage is populated with an ASP Repeater control. This shows details of people you follows activities on the site within the last 30 days.
My problem being I dont want my homepage to be too long on loading if you follow lots of people and they have been participating in lots of recent activities, meaning the repeater will be extremely long and hence my page being stretched.
What I want is for the repeater to show say 15 items/rows then below this is a 'Show more' link which will show either show the rest or each time you click shows another 15 (either/or I will be happy with!)
Here is my repeater code...
<asp:Repeater ID="RptNewsFeed" runat="server"
onitemdatabound="RptNewsFeed_ItemDataBound">
<ItemTemplate>
<div class="NewsFeedItem">
<div class="ProfileImageContainer">
<asp:HyperLink ID="HlkProfileImageLink" runat="server" EnableViewState="false">
<asp:Image ID="ImgProfileImage" runat="server" EnableViewState="false" />
</asp:HyperLink>
</div>
<div class="ProfileLinkContainer">
<asp:HyperLink ID="HlkProfileLink" runat="server" EnableViewState="false" CssClass="ActionDoneBy"></asp:HyperLink>
<asp:Label ID="LblAction" runat="server" EnableViewState="false" CssClass="Action"></asp:Label>
<asp:HyperLink ID="HlkActionObjectLink" runat="server" EnableViewState="false" CssClass="ActionDone"></asp:HyperLink>
</div>
<div class="TimeContainer">
<asp:Label ID="LblActionTime" runat="server" EnableViewState="false"></asp:Label>
</div>
</div>
</ItemTemplate>
Thanks in advance for any help provided!
Related
I have a page where i am displaying videos with their title above them. I am currently using a Repeater which renders out a div with the video title and a div with the video iframe html. Everything is coming from a database table where i store the video title and video iframe html.
<asp:Repeater ID="RptVideos" runat="server" OnItemDataBound="RptVideos_ItemDataBound">
<ItemTemplate>
<div class="TrainingVideosVideoContainer">
<div class="Title">
<asp:Label ID="LblVideoTitle" runat="server" />
</div>
<div class="Video">
<asp:Literal ID="LitYoutubeVideo" runat="server" />
</div>
</div>
</ItemTemplate>
My problem being this renders them out one below the other in a list format. I wish to render my videos out in almost a grid format, so two side by side etc. How is best to go about this? HTML Rendering? Repeater? GridVIew?
I found that #Crowcoder was correct in this suggestion to use a DataList control. With this i was able to specify the layout being in a table format with the RepeatColumns being set to 2
<asp:DataList ID="DltVideos" runat="server" OnItemDataBound="DltVideos_ItemDataBound"
RepeatColumns="2" RepeatLayout="Table" Width="100%">
<ItemTemplate>
<div class="TrainingVideosVideoContainer">
<div class="Title">
<asp:Label ID="LblVideoTitle" runat="server" />
</div>
<div class="Video">
<asp:Literal ID="LitYoutubeVideo" runat="server" />
</div>
</div>
</ItemTemplate>
</asp:DataList>
I have ASP.Net controls for search attributes with check box options and ASP.NET repeater. For Responsive Design, I have same bindings in two different places to match the design.
Here, CheckBoxList ID=Options1 & ID=Options2 both having same binding but the code will repeat. I have 400 lines to check the conditions for single binding. i have to duplicate all the codes again for the another view. Is there any way to optimize the code to single bind with both views handling. ( Avoid duplicate binding and checking)?
// Desktop View
<div class="hidden-sm hidden-xs narrowSearch">
//Content
<asp:Repeater ID="rptAttributes1" runat="server" EnableViewState="true" OnItemDataBound="rptAttributes_ItemDataBound">
<ItemTemplate>
<li>
<div class="form">
<asp:CheckBoxList ID="Options1" runat="server" AutoPostBack="false" Visible="false"
DataTextField="EnOptionName" DataValueField="SubCategoryAttributeOptionID" Font-Strikeout="False" />
</div>
</li>
</ItemTemplate>
</asp:Repeater>
</div>
// Mobile view
<div class="sec_left hidden-lg hidden-md">
<div class="moremenu narrowSearch">
//Content
<asp:Repeater ID="rptAttribute2" runat="server" EnableViewState="true" OnItemDataBound="rptAttributes_ItemDataBound">
<ItemTemplate>
<li>
<div class="form">
<asp:CheckBoxList ID="Options2" runat="server" AutoPostBack="false" Visible="false"
DataTextField="EnOptionName" DataValueField="SubCategoryAttributeOptionID" Font-Strikeout="False" />
</div>
</li>
</ItemTemplate>
</asp:Repeater>
</div>
</div>
Code Behind:
CheckBoxList chklOptions1 = item.FindControl("Options1") as CheckBoxList;
CheckBoxList chklOptions2 = item.FindControl("Options2") as CheckBoxList;
You can place your repeater (including the declarative code as well as what you have in the code-behind of your page) into a custom user control. Then you put the user control in each section (desktop and mobile) of your page. This is the simplest way to avoid repeated code. Having said this, since you've only provided part of the code that's in the code-behind class of your page, I can't speak to what changes might be required when you move the imperative code you have in your page's code-behind class to the user control.
Good luck!
I'm currently coding a web application using ASP.NET. So far my use of ASP.NET and the application has been going great, however there is one feature I would love to have, but I cannot for the life of me figure out how to do it.
I want to use some sort of list/form view, which will show both data records and empty blank templates. For example, I want to use this as an "event booking" system, where the user would click an open slot and this would then be registered to our database. This open slot is the empty template I would like.
I've done a quick paint picture to illustrate what I mean:
I assume that I'm in the right direction using a ListView, but I would like some feedback/help on a better method to achieve this.
This is my listview code (it is somewhat basic, barebones almost):
<asp:ListView ID="LV_AvailableUpdateSlots" runat="server" ItemPlaceholderID="itemPlaceholder">
<LayoutTemplate>
<asp:PlaceHolder ID="itemPlaceHolder" runat="server"></asp:PlaceHolder>
</LayoutTemplate>
<EmptyDataTemplate>No data for this date.</EmptyDataTemplate>
<ItemTemplate>
<asp:Panel ID="Pnl_AvailableSlot" runat="server" CssClass="UpdateDiarySlotPanel">
<div class="FloatLeftInline">
<asp:Label ID="Lbl_ClientName" runat="server" Text="Name: "></asp:Label>
<asp:Label ID="Lbl_ClientNameEval" runat="server" Text='<%# Eval("RefID") %>'></asp:Label>
</div>
<asp:Label ID="Lbl_ClientProductEval" runat="server" Text='<%# Eval("ClientMainProductID") %>'></asp:Label>
<div class="FloatRightInline">
<asp:Label ID="Lbl_Version" runat="server" Text="Version: "></asp:Label>
<asp:Label ID="Lbl_VersionEval" runat="server" Text= '<%# Eval("Version") %>'></asp:Label>
</div>
</asp:Panel>
</ItemTemplate>
<InsertItemTemplate>
Insert here.
</InsertItemTemplate>
<EmptyItemTemplate>No data found.</EmptyItemTemplate>
</asp:ListView>
A ListView sounds good, but I does not hurt to take a look at Repeater
Repeater Web Server Control Declarative Syntax
If you have the time do a simple test implementing using a ListView and a Repeater to compare the benefits and see which one fits better your needs and appearance
Master Page
<div id="header" style="height: 150px; width: 750px;">
<asp:Label ID="Label3" runat="server" Text="LoggedInUser:"></asp:Label>
<asp:Label ID="lblLoggedInUser" runat="server" Text=""></asp:Label>
</div>
<div id="leftMenu" class="leftmenu">
<br />
<asp:DropDownList ID="ddlFamilyMembers" runat="server"
style="height: 25px; width: 125px" DataTextField="FullName"
DataValueField="MembershipGen"
onselectedindexchanged="ddlFamilyMembers_SelectedIndexChanged"
AutoPostBack="True" >
</asp:DropDownList>
<br /><br />
<asp:Image ID="imageMember" class="space" runat="server" Height="150px" Width="125px" />
<br /><br /><br />
<asp:Label ID="Label1" runat="server" class="space" Text="MembershipID:"></asp:Label>
<asp:Label ID="lblMembershipID" runat="server" Text=""></asp:Label>
<br />
<asp:Label ID="Label2" runat="server" class="space" Text="Name:"></asp:Label>
<asp:Label ID="lblMemberName" runat="server" Text=""></asp:Label>
<br /><br /><br />
<asp:LinkButton ID="lbInformation" class="space" runat="server" onclick="lbInformation_Click">Member Information</asp:LinkButton><br />
<asp:LinkButton ID="lbAddress" class="space" runat="server"
onclick="lbAddress_Click">Member Address</asp:LinkButton>
</div>
<div id="divRight" class="divright">
<asp:ContentPlaceHolder ID="CPHMain" runat="server">
</asp:ContentPlaceHolder>
</div>
I posted my masterpage code so you can better understand my issue. Since these controls are in my master page I needed to create public properties for all the controls in my masterpage to databind my content pages. Maybe I am approaching this wrong but this is how I was planning on achieving this.
ContentPage
Default.aspx page_load event would call my method to retrieve the data and set the dropdownlist, image, 2 label fields. On selected index change of dropdownlist it would grab the new values from another method and populate those controls accordingly.
To access these controls in my master page i read you can do it a couple of different ways one is to <%#MasterType VirtualPath="~/Member.Master" %> and then create a strongly typed connection. Or you could create a loosely type connection.
My problem with these ways as I am going to have over 15 content pages and I would hate to have to rebind the DropDownList every time one of the content pages is called. Also I would have to reinstantiate the controls in every method of my content pages which I assume I am doing this wrong.
Can someone give me some advice on what is the proper way to achieve this without so much repetitive code?
You've got the right idea, trying to decouple the parent from the child, but I think the way you want to do it may be clunky.
Assuming you can do this, what I'd do is as follows:
Make a public method BindFamilyMembers(string parameter) on the Master page's code-behind.
From the child page, pass necessary unique parameters to this BindFamilyMembers Master method.
This way you don't need to expose the controls themselves, you expose a method that modifies those controls based on parameters.
edit
You want to notify the child page that the DDL SelectedIndex has changed. This is a great case for custom events.
You can configure an event on the Master page that the child page listens for. When DDL.SelectedIndex changes, you can fire the custom event (and pass the selected information) via the custom event, and any child page that is listening can handle that event.
There are a lot of examples of custom events online. Here's one you can start with: http://www.marten-online.com/csharp/simple-custom-event-handling.html
I am developing a simple message board in ASP.NET Web forms and I list all posts in a ListView controller. My code looks something like this:
<ItemTemplate>
<article class="post">
<div class="postinfo">
<div class="postauthor">
Author: <strong><%# Eval("Author") %></strong>
</div>
<div class="postdate">
Date: <strong><%# Eval("PostDate", "{0:D}") %></strong>
</div>
<div class="postvotes">
<asp:Button class="postupvote" id='up<%# Eval("Id") %>' runat="server" />
<asp:Label ID="postvotescount_<%# Eval("Id") %>" class="postvotescount" runat="server" Text="<%# Eval("Votes") %> votes"></asp:Label>
<asp:Button class="postdownvote" id='down<%# Eval("Id") %>' runat="server" />
</div>
</div>
<div class="postcontent"><%# Eval("Text") %></div>
</article>
</ItemTemplate>
My problem is the voting functionality. I want to have css id properties, containing the unique database id of the post. That way I will know the Id of the post, it was voted for. So is this possible and if not, how can I achieve this?
Thanks!
You could use ClientIdMode and set it to predictable
http://msdn.microsoft.com/en-us/library/system.web.ui.clientidmode.aspx
<asp:ListView ID="ListView1"
ClientIDMode="Predictable"
ClientIDRowSuffix="ProductID"
DataSourceID="XmlDataSource1" runat="server" >
<ItemTemplate>
</ItemTemplate>
</asp:ListView>
This assumes you are using .Net 4.0 or above.