Repeater not firing proper with Divs on page in asp.net - c#

I want to make a slideshow with divs in repeater items. there are two divs with different classes and cannot show page properly with it. Could you help me please to fix the problem?
Design cs is like this:
<div id="wowslider-container1">
<asp:Repeater ID="rpSlideshow" runat="server" >
<ItemTemplate>
<div class="ws_images">
<ul>
<li id="<%# Container.ItemIndex + 1 %>">
<img src="Yazar/data1/images/<%#Eval("Resmi") %>" alt="<%#Eval("AdSoyad") %>" title="<%#Eval("AdSoyad") %>"
id="<%#Eval("SlideID") %>" />
</li>
</ul>
</div>
<div class="ws_bullets">
<div>
<a href="#" title="<%#Eval("SlideID") %>"><span>
<img src="Yazar/data1/tooltips/<%#Eval("Resmi") %>" alt="<%#Eval("AdSoyad") %>" /><%#Eval("SlideID") %></span></a>
</div>
</div>
<div class="ws_shadow">
</div>
</ItemTemplate>
</asp:Repeater>
</div>
PS: I tried to combine divisions like below but it did not work proper.
((HtmlGenericControl)(e.Item.FindControl("myDiv"))).
Attributes["class"] = "id" + indexi++;

You need runat="server" attribute, if you want to access it at code behind.
<div id="myDiv" runat="server">...</div>
TIP: For that purpose, we normally use Panel server control which basically renders html div tag. The advantage is you can use strongly type CssClass property.
<asp:Panel id="MyPanel" runat="server">...</asp:Panel>
Usage: ((Panel)e.Item.FindControl("MyPanel")).CssClass = "id" + indexi++;
Please note that I rename the control id to MyPanel.

Related

Rendering dinamically GenericHtmlControl/Literal merged with an Asp.net Control

My Environment is: ASP.NET 4.62 / C# / Boostrap 4 framework
My application renders bootstrap 4 menu from database query.
I've a div in aspx page
<div id="myNav" runat="server"></div>
and i add code behind as
myNav.InnerHtml = mystr.ToString()
Now i need to integrate in the menu a LoginView asp.net control.
Obviously if i add
<asp:LoginView id="LoginView1" runat="server" ViewStateMode="Disabled">
as string, the browser will receive a string a not renders a control ASP.NET.
I need to render something like this
....previous items menu
<asp:LoginView id="LoginView1" runat="server" ViewStateMode="Disabled">
<AnonymousTemplate>
<ul class='nav navbar-nav ml-auto'>
<li class='nav-item'>
<a class='nav-link' href='../../Account/Login.aspx'><span class='fas fa-user'>
</span>Login</a> </li>
<li class='nav-item'><a class='nav-link' href='~/Account/Login.aspx'>
<span class='fas fa-sign-in-alt'></span> Login</a> </li> </ul>
</AnonymousTemplate>
<LoggedInTemplate>
<ul class='nav navbar-nav ml-auto'>
<li class='nav-item'>
<a class='nav-link' href='~/Account/Login.aspx'><span class='fas fa-user'></span></a>
</li>
<li class='nav-item'>
<span class="myText">Hallo, </span><a runat="server" class="username"
href="~/Account/Manage.aspx" title="Profile">
<asp:LoginName runat="server" CssClass="username" />
</a>!
<asp:LoginStatus runat="server" LogoutAction="Redirect" LogoutText="Exit"
LogoutPageUrl="~/Logout.aspx" />
</li> </ul>
</LoggedInTemplate>
</asp:LoginView>
...closing boostrap menu tag
Which is best way to resolve this type of problem ?
I need to change approach ?
You are creating the HTML at the server side; that is a possibility, but as you see, it makes it hard to combine this with ASP.NET server controls.
It would be better to put the HTML on the .aspx-page. I understand that your database knows which menu-items should be visible. And that you want to add 1 additional item, where users can login.
You could use (for example) a GridView with one column.
<Columns>
<asp:TemplateField>
<ItemTemplate>
<div>Your HTML here </div>
<div><%# Item.SomeProperty %></div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
Use the data from your database to render one 'row' per menuitem in the grid. You can customize the TemplateField so it contains the bootstrap-layout as you need it.
It might also be possible to keep your current approach. I think then you should at least not create your opening and closing bootstrap-menu tags in the code-behind. You should put those tags on the .aspx-page itself, the structure would then be:
<opening tag bootstrap menu>
<div id="myNav" runat="server"></div>
<asp:LoginView id="LoginView1" runat="server" ViewStateMode="Disabled"> ... </ ..>
<closing tag bootstrap menu>

Rendering content in a grid layout

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>

how to bind a nested Repeater to an objectdatasource

I'm Completely new at ASP.net
My database model is here
As it shows in the above picture I have a table it's name is Tours and it has a column named TourId.
I have an object Data Source in my Webform and a repeater the code is below:
<asp:ObjectDataSource ID="ODSTTitle" runat="server" SelectMethod="GetById" TypeName="ATourRep">
<SelectParameters>
<asp:QueryStringParameter DefaultValue="0" Name="Id" QueryStringField="CID" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server">
</asp:ObjectDataSource>
<div class="container" id="TourDetail">
<asp:Repeater ID="RptTourDetail" runat="server" DataSourceID="ODSTTitle" ItemType="Tour" EnableViewState="false">
<ItemTemplate>
<li>
<div class="row">
<div class="col-md-3">
<%-- NestedRepeater --%>
<asp:Repeater ItemType="TourDate" ID="RptTourNested" runat="server" EnableViewState="false">
<ItemTemplate>
<h2>
<%-- What Should I write Here to have a list of each TourDate --%>
</h2>
</ItemTemplate>
</asp:Repeater>
</div>
<%-- This div works correctly --%>
<div class="col-md-6">
<h4>
<%# Item.TName %>
</h4>
<p>
<%# Item.TDes %>
</p>
</div>
</div>
</li>
</ItemTemplate>
</asp:Repeater>
</div>
As The code Shows there is a nested repeater that it has h2 tag. i need to show a list of each TourDates in h2 tag.
I dont know how to bind ObjectDataSource1 to use TourId of each Tour and then Get StartDates of that tour. and also what I should write in h2 tag of nested repeater to show satrtdates of that tour
((There is more than one startdate for each tour))
and i have this method in my repository also
public IQueryable<TourDate> GetById(int Id)
{
return model.TourDates.Where(e => e.TourId == Id);
}
I used Default value of ObjectDataSource and then bind it by eval but it dosent work.
do you have any suggestion or am I wrong in structre or do you think is there any better than nested repeaters there?
In the parent repeater you need to implement a Repeater.ItemDataBound event as specified here https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.repeater.itemdatabound%28v=vs.110%29.aspx, then inside that event you need to get for each item (row) the information you need and send the datasource to the inner Repeater, and then call for its databind function.
This Article was Helpful. that was exactly what i needed
https://msdn.microsoft.com/en-us/library/bb510145.aspx#aspnettut32vbnesteddata_topic4

Error setting Control Value within asp:ListView LayoutTemplate

So I'm really not sure what I'm doing wrong here, but my code is clearly not working. I have my list view doing everything that I need, except that when I use the ListView.FindControl() method, and then set a property on that control, it give me an Object reference not set to an instance of an object. error. Here is my code:
ASPX
<p class="rates-title"><span>
<asp:Literal ID="currentDate" runat="server"></asp:Literal></span><br>
Todays Rates</p>
<span class="rates-arrow sprite"></span>
<asp:ListView ID="RatesList" ItemPlaceholderID="RSSPlaceholder" runat="server">
<LayoutTemplate>
<ul>
<asp:PlaceHolder ID="RSSPlaceholder" runat="server"></asp:PlaceHolder>
<li>
<asp:HyperLink ID="AllRatesLink" CssClass="all-rates" runat="server">
View All Rates<span></span>
</asp:HyperLink>
</li>
</ul>
</LayoutTemplate>
<ItemTemplate>
<li>
<div class="rate-text">
<p><%# Eval("Name") %></p>
<div class="rate">
<p><%# Eval("InitialRate") %>%</p>
</div>
</div>
<%# Eval("Apr") %>
<div class="todays-rates-rollover">
<p><%# Eval("ContentTruncated") %></p>
</div>
</li>
</ItemTemplate>
</asp:ListView>
Code Behind
currentDate.Text = DateTime.Now.ToString("MM.dd.yy");
HyperLink allRatesLink = (HyperLink)RatesList.FindControl("AllRatesLink");
allRatesLink.Text = "hello";
So the weird thing is that currentDate works just fine, the data that I use (elsewhere in my codebehind) works just fine for iterating through the list, but as soon as I set any property on the allRatesLink control, it gives the object reference not set error. Any ideas/help on this one?
allRatesLink is null because it is not being found which leads to the Object reference error when you try to set a property of null.
You need the FindControl to be called after the LayoutTemplate is created such as in the OnLayoutCreated handler or after DataBind()

asp.net repeater select ID with Jquery

I hope i make sense this, i have a repeater and on click of a button, the corresponding div should open up, I can do this when it is hardcoded however since its a repeater there will be different IDs. Here is my repeater;
<asp:Repeater ID="rptProfileStatus" OnItemDataBound="rptProfileStatus_OnItemDataBound"
runat="server">
<ItemTemplate>
<li class="bar1">
<a name="jh"></a>
<div align="left" class="post_box">
<div class="itembottom">
<span class="date">
<asp:Label ID="lblDate" Font-Underline="false"
ForeColor="white" runat="server"></asp:Label>
</span>
<span class='feed_link'>
</span>
<span class="commentsno">
2 comments
</span>
</div>
<span class="delete_button">
</span>
</div>
<div id="fullbox" class="fullboxahrefReply"></div>
<div id="commentload"></div>
</li>
</ItemTemplate>
</asp:Repeater>
Here is the jquery which i am trying to get to call it, it works now however when i start changing the ID's i will have a problem, how do i solve this;
//Comment Box Slide
$("[id$=ahrefReply]").live("click", function ()
{
var ID = $(this).attr("id");
$(".fullbox" + "ahrefReply").show();
$("#c" + "ahrefReply").slideToggle(300);
});
In the anchor's click event, you can do something like,
click="YourFunction(<%# ((YourClass)Container.DataItem).Id %>)"
Then handle the id in your function. You will have to modify this to work with your situation as well.
Try just walking up the DOM. Something like this:
$(this).parent().parent().find('fullboxahrefReply').show()

Categories