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()
Related
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>
I have client request where there will be 3 columns out of these 3 columns,if any one column data is empty i need to show empty label error in that particular column.i want to use repeater control only please tell me guys how can i handle this my front end code is below and i don't know how to handle from code behind please help
<asp:Repeater ID="Repeater_ClientSection" runat="server" Visible="false">
<ItemTemplate>
<div class="col-md-4 col-sm-6">
<div class="serviceBox">
<i class="service-icon fa fa-globe"></i>
<h4 class="title"><%#Eval("Client_Name")%></h4>
<p class="description"><%#Eval("Client_Details")%></p>
<a href="#" class="read-more">
<span>Read More</span>
<i class="fa fa-angle-right"></i>
</a>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
[1]: https://ibb.co/48kF0Sz want to implement like this image
You could do a ternary operator in the ItemTemplate
<%# !string.IsNullOrEmpty(Eval("Client_Name").ToString()) ? Eval("Client_Name") : "EMPTY" %>
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.
Was hoping someone would be able to help me. I'm basically attempting to call a method within an class using a HTML button. The reasoning behind this is because I'm intending to make it work similar to a login (and wanting it to hold sessions upon logging in), as well as keeping the current, visual effects of the button.
Upon research, there is some places basically saying you can do it, however it simply won't work for me for some reason. Where it says you can do it-
HTML Button like a ASP.NET Button
Here is my code-
<form runat="server">
<div class="input">
<asp:TextBox ID="txtUser" runat="server" type="email" placeholder="Username"></asp:TextBox>
<span><i class="fa fa-envelope-o"></i></span>
</div>
<div class="input">
<asp:TextBox ID="TextBox1" runat="server" type="password" placeholder="Password"></asp:TextBox>
<span><i class="fa fa-lock"></i></span>
</div>
</form>
<button id="button1" runat="server" onserverclick="doIt" class="submit"><i class="fa fa-long-arrow-right"></i></button>
With the C# code containing
public partial class Login : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void doIt(object sender, EventArgs e)
{
Response.Redirect("index.html");
}
}
Am I going about this the totally wrong way? (The redirect was just there as a test for now, until I'm able to get it to run the method since it doesn't run it.)
Any help is appreciated.
Below is all my HTML code:
<form class="login">
<fieldset>
<legend class="legend">Login</legend>
<form runat="server">
<div class="input">
<asp:TextBox ID="txtUser" runat="server" type="email" placeholder="Username"></asp:TextBox>
<span><i class="fa fa-envelope-o"></i></span>
</div>
<div class="input">
<asp:TextBox ID="TextBox1" runat="server" type="password" placeholder="Password"></asp:TextBox>
<span><i class="fa fa-lock"></i></span>
</div>
<button id="button1" runat="server" onserverclick="doIt" class="submit"><i class="fa fa-long-arrow-right"></i></button>
</form>
</fieldset>
<div class="feedback">
login successful <br />
redirecting...
</div>
</form>
You have a nested form in your HTML, which is invalid markup. Remove the inner form, and add runat="server" to the form remaining. Then place your button inside the form like so:
<form class="login" runat="server">
<fieldset>
<legend class="legend">Login</legend>
<div class="input">
<asp:TextBox ID="txtUser" runat="server" type="email" placeholder="Username"></asp:TextBox>
<span><i class="fa fa-envelope-o"></i></span>
</div>
<div class="input">
<asp:TextBox ID="TextBox1" runat="server" type="password" placeholder="Password"></asp:TextBox>
<span><i class="fa fa-lock"></i></span>
</div>
<%-- place the button here --%>
<button id="button1" runat="server" onserverclick="doIt" class="submit"><i class="fa fa-long-arrow-right"></i></button>
</fieldset>
<div class="feedback">
login successful
<br />
redirecting...
</div>
</form>
Each web form - .aspx - should contain one form, and must contain runat="server" for the .cs file to manage. All server-side elements - elements with the runat="server", such as your <button> must be contained within it for the code behind to be able to point to it. If you don't, you should receive a Invalid postback or callback argument exception yellow screen of death.
I am using Repeater in ASP.Net. I am accessing content from the data base. Every id or class of html element is same. It is a new heading in multiple. There is read button.
I want to open a new page with full description of that heading in a new page.
I have problem in assigning unique id from which I know which heading is clicked.
This is the code of that part:
<div class="content">
<table>
<tr>
<td class="contl">
<div>
<asp:Repeater ID="RepCountry" runat="server" OnItemCommand="RepCountry_ItemCommand">
<ItemTemplate>
<div class="contentbox">
<div class="postheading">
<%#Eval("title")%>
</div>
<table>
<tr><td> <div class="postimage">
<img src="Admin/images/<%# Eval("img")%>" alt="" height="50%" width="100%" />
</div></td>
<td><div class="discp">
<div class="dpost">
<p style="font-family: Times New Roman">
<%#Eval("p_date")%></p>
</div>
<div class="discp_c">
<p>
<%# Eval("descr").ToString().Substring(0,200).ToString()%></p>
<p style="color: Maroon">
<a id="A1"+ href="Readmore.aspx?oid=" runat="server" onclick="changeid(this.id)">Read More.</a></p>
</div>
<div class="social">
<a href="">
<img src="images/t.png" alt="twtter" /></a> <a href="">
<img src="images/f.png" alt="facebook" /></a> <a href="">
<img src="images/g.png" alt="gmail" /></a> <a href="">
<img src="images/in.png" alt="linkedin" /></a>
</div>
</div></td></tr>
</table>
</div>
</ItemTemplate>
</asp:Repeater>
I see you have already used Eval to insert a Description in your items:
<div class="discp_c">
<p>
<%# Eval("descr").ToString().Substring(0,200).ToString()%></p>
<p style="color: Maroon">
...
If I read the code well, you are reading at least title, descr, img the database query?
If so, then make sure that the query also returns the ID (Primary Key) of the article, and use Eval to insert that ID in the link. So, if the primary key of the article in the database is named for example articleID, then change your database query from
SELECT xxx as title, yyy as descr, zzz as img ....
to
SELECT id as articleID, xxx as title, yyy as descr, zzz as img ....
Then you can use the ID provided by the database to make a full link to an article:
<a runat='server' ....
href='Readmore.aspx?oid=<%# Eval("articleID").ToString()%>'
....>
...</a>
and so the Readmore.aspx page will exactly know which article should be opened. It will come directly as oid query parameter, no extra work to do.
If you really need it, you can use the same trick to generate the HTML ID of that tag:
<a runat='server' ....
id='ID_<%# Eval("articleID").ToString()%>'
href='Readmore.aspx?oid=........'
....>
...</a>
and with that, the <a> tags will have IDs like ID_32131, ID_4532455, ID_1231455 and the IDs will be unique as long as the database query returns unique articles.