I have my masterpage:
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="KezberProjectManager.master.cs" Inherits="KezberProjectManager.KezberProjectManager" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<!-- Le styles -->
<link href="assets/css/bootstrap.css" rel="stylesheet"/>
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet"/>
<link href="assets/css/kezblu.styles.css" rel="stylesheet"/>
<style type="text/css">
</style>
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="assets/js/kezcommon.js"></script>
<script type="text/javascript">
$(document).ready
(
function () {
createAutoClosingAlert('.success_alert', 6000);
}
);
function createAutoClosingAlert(selector, delay) {
var alert = $(selector).alert();
window.setTimeout(function () { $(alert).slideUp() }, delay);
}
</script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<asp:Repeater runat="server" id="MenuRepeater">
<headertemplate>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#">KezBlu</a>
<div class="nav-collapse collapse">
<ul class="nav">
</headertemplate>
<itemtemplate>
<%# Eval("Content") %>
</itemtemplate>
<footertemplate>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
</footertemplate>
</asp:Repeater>
<div id="wrap">
<div id="content">
<div id="alerts">
<div class="bs-docs-example">
<div id="auth">
<asp:HyperLink id="HyperLink1" runat="server">HyperLink</asp:HyperLink>
</br>
<asp:HyperLink id="HyperLink2" runat="server">HyperLink</asp:HyperLink>
</div>
<div runat="server" id="success_alert" class="success_alert alert alert-success fade in">
<button type="button" class="close" data-dismiss="alert">×</button>
<div runat="server" id="success_alert_text">
</div>
</div>
</div>
<div class="bs-docs-example">
<div runat="server" id="error_alert" class="error_alert alert alert-error fade in">
<button type="button" class="close" data-dismiss="alert">×</button>
<div runat="server" id="error_alert_text">
</div>
</div>
</div>
</div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</form>
<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
</body>
</html>
In there I have:
<div id="auth">
<asp:HyperLink id="HyperLink1" runat="server">HyperLink</asp:HyperLink>
</br>
<asp:HyperLink id="HyperLink2" runat="server">HyperLink</asp:HyperLink>
</div>
Like this, the links show up fine in code behind.
Now, if I move them into my repeater's footer:
...
<div class="nav-collapse collapse">
<ul class="nav">
</headertemplate>
<itemtemplate>
<%# Eval("Content") %>
</itemtemplate>
<footertemplate>
</ul>
<div id="auth">
<asp:HyperLink id="HyperLink1" runat="server">HyperLink</asp:HyperLink>
</br>
<asp:HyperLink id="HyperLink2" runat="server">HyperLink</asp:HyperLink>
</div>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
</footertemplate>
</asp:Repeater>
Then they no longer can be used in code behind.
I really really do not understand this.
Why is it not working?
The RepeaterItem has a different NamingContainer. You can access only controls that are on top of the page directly since these controls are created in the partial codebehind class automatically. You have to use FindControl to get the reference of a control in a RepeaterItem.
In this case you could use the Repeater's ItemDataBound event:
protected void Repater1_ItemDataBound(Object Sender, RepeaterItemEventArgs e)
{
// This event is raised for the header, the footer, separators, and items.
if (e.Item.ItemType == ListItemType.Footer)
{
HyperLink hl = (HyperLink)e.Item.FindControl("HyperLink1");
}
}
Because the controls are no longer on the main form they are no longer properties of the Page. They can instead be accessed through the Repeater.
See this question for an example on accessing the controls through the Repeater.
When you are putting objects into Repeaters, Grids, etc, you have to do a lot more processing in the backend to be able to find them. Basically when the repeater is bound, you can go through and search for the object, and then access its properties.
For example here is a link to some code for a repeater looking up the various item controls when an Item is bound
protected void rptTaskListOnItemDataBound(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
{
var lnkEdit = e.Item.FindControl("lnkEdit") as HyperLink;
var lnkDelete = e.Item.FindControl("lnkDelete") as LinkButton;
var pnlAdminControls = e.Item.FindControl("pnlAdmin") as Panel;
var t = (Task)e.Item.DataItem;
if (IsEditable && lnkDelete != null && lnkEdit != null && pnlAdminControls != null)
{
pnlAdminControls.Visible = true;
lnkDelete.CommandArgument = t.TaskId.ToString();
lnkDelete.Enabled = lnkDelete.Visible = lnkEdit.Enabled = lnkEdit.Visible = true;
lnkEdit.NavigateUrl = EditUrl(string.Empty, string.Empty, "Edit", "tid=" + t.TaskId);
ClientAPI.AddButtonConfirm(lnkDelete, Localization.GetString("ConfirmDelete", LocalResourceFile));
}
else
{
pnlAdminControls.Visible = false;
}
}
}
Personally I have never tried to get to the controls in a header or footer of a repeater, but I am sure it would be something similar
Related
I am trying to change the text of label in master page which is inside modal and from content page i am trying to set the text.
This is my master page:
<%# Master Language="C#" AutoEventWireup="true"
CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1 maximum-
scale=1, user-scalable=no" />
<link href="../Content/bootstrap.min.css" rel="stylesheet" />
<link href="../Style/StyleSheet.css" rel="stylesheet" />
<link href="../Content/font-awesome.min.css" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?
family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet"
type="text/css" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/0.1.0/css/footable.min.css" rel="stylesheet" type="text/css" />
<script src="../Scripts/jquery-1.9.1.min.js"></script>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<div id="header">
<form id="Form1" runat="server">
<header>
</header>
<div class="container-fluid" id="body">
<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
<div class="modal fade" id="myModal">
<div class="modal-dialog">
<div class="modal-content" style="width: 400px;margin: 0 auto;">
<div class="modal-header" runat="server">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span></button>
<h4 class="modal-title"><asp:Label ID="lblMasterMessage" runat="server" Text="Label"></asp:Label> </h4>
</div>
<div class="modal-body">
<asp:Label ID="lblMasterbodyMessage" runat="server" Text="gh" />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<footer class="panel-footer white">
<div class="row">
</div>
</footer>
</form>
</div>
<script src="../Scripts/bootstrap.min.js"></script>
</body>
</html>
script in child page which opens modal:
<script type="text/javascript">
function openModal(message) {
$('#myModal').modal('show');
}
</script>
code behind child page calling the script and changing text of label in modalpopup
ScriptManager.RegisterStartupScript(this, this.GetType(), "LaunchServerSide", "$(function() { openModal(); });", true);
Label lblMaster = (Label)Master.FindControl("lblMasterbodyMessage");
string message = "something";
lblMaster.Text = message;
i also tried the second approach by setting properties in master page but text in the popup is not getting updated. any help will be appreciated
Best approach will be to provide a get/set property in your master page that will accept value and assign it to the label value property.
Master Page
public partial class MasterPage : System.Web.UI.MasterPage
{
protected void Page_Load(object sender, EventArgs e)
{
}
public string MasterBodyMessage // you can use some meaningfull name over here.
{
get { return this.lblMasterbodyMessage.Text; }
set { this.lblMasterbodyMessage.Text = value; }
}
}
Child Page
ScriptManager.RegisterStartupScript(this, this.GetType(), "LaunchServerSide", "$(function() { openModal(); });", true);
var master = this.Master as MasterPage;
if (master != null)
{
master.MasterBodyMessage = "Some Meaningful Message!!!";
}
Else you can do some work around using javascript/jQuery to add message into label in master page. For this you will need to amend following changes.
HTML Aspx Page
<div class="modal-content" style="width: 400px;margin: 0 auto;">
<div class="modal-header">
<button aria-label="Close" class="close" data-dismiss="modal" type="button"><span aria-hidden="true">×</span></button>
<h4 class="modal-title"><label id="lblMasterMessage"></label></h4>
</div>
<div class="modal-body">
<label id="lblMasterbodyMessage"></label>
</div>
<div class="modal-footer">
<button class="btn btn-primary" data-dismiss="modal" type="button">Close</button>
</div>
</div>
Code Behind Page
string message = "Some Meaningful Message!!!";
ScriptManager.RegisterStartupScript(this, this.GetType(), "LaunchServerSide", "openModal('"+ message +"');", true);
jQuery Script
<script type="text/javascript">
function openModal(message) {
$('#myModal').modal('show');
$('#lblMasterbodyMessage').html(message);
}
</script>
Specify your master page class name in TypeName attribute of MasterType directive.
<%# MasterType TypeName="MasterPageClassName" %>
Now you can access your public properties as this.Master.propertyname
Also try by moving your code from page load event to PreRenderComplete event of page.
That'll solve you're problem
Having a unusual problem with an application I'm building, so what I'm looking to do is a user can view preview of their adverts they have created, click the advert which is a dynamic link and be brought to a new page which will show the advert in more detail. The more detail page is then runs a to check the query string, pass the parameters of the query sting to a method which pulls the correct details form the database. This part works perfectly, but when the object is returned the pages loads again, calls the same method 3 times, but with null parameters which in returns a null reference to an object that doesn't exist.
I've tried to refactor the code so when a page loads it won't retrieve form the database unless the search parameters are valid. When the page loads, components won't work then, for example the Image Carousel.
I've tried hard coding the parameters into the method, will work perfectly. will only load once.
I've created two new pages which do not inherit form a master page and used the exact same methods. works perfectly. I tried the method on a two different pages that are inherited form the master page and same problem.
Detailed Page.aspx
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPage.Master" AutoEventWireup="true" CodeFile="DetailAdvert.aspx.cs" Inherits="Lenders.ie.DetailAdvert" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div class="col-lg-9">
<div class="container">
<div class="row">
<!--Advert Image -->
<div class="container">
<div class="row">
<!-- Carosel goes here -->
<div class="row carousel-holder">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-10">
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img class="slide-image" id="Img1" runat="server" src="http://placehold.it/800x380" alt=""/>
</div>
<div class="item">
<img class="slide-image" id="Img2" runat="server" src="http://placehold.it/800x380" alt=""/>
</div>
<div class="item">
<img class="slide-image" id="Img3" runat="server" src="http://placehold.it/800x380" alt=""/>
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
</div>
</div>
</div>
<!--User Details-->
<br />
<div class="container">
<div class="row">
<!-- Descriptin and profile view -->
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-5">
<div class="well well-sm">
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<img src="" runat="server" id="imgProfilePic" alt="" class="img-rounded img-responsive" />
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<h4>
<asp:Label ID="lblFristName" runat="server" Text=""></asp:Label>
<asp:Label ID="lblSecondName" runat="server" Text=""></asp:Label>
</h4>
<small><cite title="Location"><asp:Label ID="lblLocation" runat="server" Text=""></asp:Label> <i class="glyphicon glyphicon-map-marker">
</i></cite></small>
<p>
<i title="Email" class="glyphicon glyphicon-envelope"></i> <asp:Label ID="lblEmail" runat="server" Text=""></asp:Label>
<br />
<i title="Join Date" class="glyphicon glyphicon-user"></i> <asp:Label ID="lblJoinDate" runat="server" Text=""></asp:Label><br />
<i title="User Rating" class="glyphicon glyphicon-stats"> </i><asp:Label ID="lblUserRating" runat="server" Text=""></asp:Label><br />
<i title="Contact Number" class="glyphicon glyphicon-phone"> </i><asp:Label ID="lblContactNumber" runat="server" Text=""></asp:Label>
</p>
<!-- Split button -->
<asp:Button ID="btnMessage" runat="server" Text="Message" CssClass="btn btn-success" />
</div>
</div>
</div>
</div>
<!-- Description / Product Details-->
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-5">
<div class="well well-sm">
<h4> Description: </h4>
<p>
<asp:Label ID="lblDesc" runat="server" Text=""></asp:Label>
</p>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<!-- Comment Section -->
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-10">
<div class="well well-sm">
<h4>Comments</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
</asp:Content>
Detailed Aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using BLL;
using DataModels;
namespace Lenders.ie
{
public partial class DetailAdvert : System.Web.UI.Page
{
public Advert_User ReturnedUserAdvet = new Advert_User();
public BalAdvertManger BALMan = new BalAdvertManger();
protected void Page_Load(object sender, EventArgs e)
{
//Response.Cache.SetCacheability(HttpCacheability.NoCache);
//Response.ExpiresAbsolute = DateTime.Now.AddMonths(-1);
//GetData();
//PopulatePage();
//int UserID = Convert.ToInt32(Request.QueryString["UiD"]);
//int AdvertID = Convert.ToInt32(Request.QueryString["AdID"]);
if (!Page.IsPostBack)
{
GetData();
}
}
public void GetData()
{
//int UserID = 41;
//int AdvertID = 2;
int UserID = Convert.ToInt16(Request.QueryString["UiD"]);
int AdvertID = Convert.ToInt16(Request.QueryString["AdID"]);
if (UserID != 0 || AdvertID != 0)
{
ReturnedUserAdvet = BALMan.ReturnDetailedAdvert(UserID, AdvertID);
PopulatePage();
}
//int UserID = Convert.ToInt32(Request.QueryString["UiD"]);
//int AdvertID = Convert.ToInt32(Request.QueryString["AdID"]);
//int UserID = 41;
//int AdvertID = 2;
//ReturnedUserAdvet = BALMan.ReturnDetailedAdvert(UserID,AdvertID);
}
public void PopulatePage()
{
}
}
}
This is where the link is and directs to the Detailed page.
Profile Page.aspx
<%# Page Title="" Language="C#" EnableEventValidation="false" MasterPageFile="~/MasterPage.Master" AutoEventWireup="true" CodeBehind="ProfilePage.aspx.cs" Inherits="Lenders.ie.ProfilePage1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div class="container">
<div class="row">
<%-- Adverts View--%>
<asp:View ID="AdvertsView" runat="server">
<h2>Adverts</h2>
</asp:View>
<%-- View Adverts --%>
<asp:View ID="View_ViewAdverts" runat="server">
<h2>View Adverts</h2>
<div class="row">
<asp:Literal ID="Advert1" runat="server"></asp:Literal>
<asp:LinkButton ID="LinkButton1" OnClick="LinkButton1_Click" runat="server">LinkButton</asp:LinkButton>
</div>
</asp:View>
<%--There was three closing divs here--%>
<asp:View ID="MessageView" runat="server">
<h2>Messages</h2>
</asp:View>
</asp:MultiView>
</div>
</div>
</div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
ProfilePage aspx.cs - Method that creates the link
public void DisplayUserAdverts()
{
int UserID = Convert.ToInt32(Session["UserID"]);
int i = 0;
ListOfUserAdverts = BalAdvertManager.ReturnUserAdvert(UserID);
StringWriter stringWriter = new StringWriter();
using (HtmlTextWriter writer = new HtmlTextWriter(stringWriter))
{
foreach (Advert item in ListOfUserAdverts)
{
string ColDiv = "col-sm-4 col-lg-4 col-md-4";
string ThumbClass = "thumbnail";
string Image = "AdvertThumbnails/" + item.Img1.ToString();
string Caption = "caption";
string Link = "DetailAdvert.aspx/?AdID=" + item.AdvertID.ToString() + "&UiD=" + item.UserID.ToString();
Button btn = new Button();
writer.AddAttribute(HtmlTextWriterAttribute.Class, ColDiv);
writer.RenderBeginTag(HtmlTextWriterTag.Div);
writer.AddAttribute(HtmlTextWriterAttribute.Class, ThumbClass);
writer.RenderBeginTag(HtmlTextWriterTag.Div);
//writer.AddAttribute(HtmlTextWriterAttribute.Src, Image);
writer.AddAttribute(HtmlTextWriterAttribute.Href, Link);
writer.RenderBeginTag(HtmlTextWriterTag.A);
writer.AddAttribute(HtmlTextWriterAttribute.Src, Image);
writer.RenderBeginTag(HtmlTextWriterTag.Img);
writer.RenderEndTag();
writer.RenderEndTag();
writer.AddAttribute(HtmlTextWriterAttribute.Class, Caption);
writer.RenderBeginTag(HtmlTextWriterTag.Div);
//writer.AddAttribute(HtmlTextWriterAttribute.Src, Image);
//writer.RenderBeginTag(HtmlTextWriterTag.Div);
//writer.AddAttribute(HtmlTextWriterAttribute.Class, Caption);
writer.RenderBeginTag("h4");
writer.Write(item.Title.ToString());
writer.RenderEndTag();
writer.RenderBeginTag("p");
//Does Something
writer.Write(item.Desc.ToString().Substring(0, 50));
writer.Write("</br>");
writer.Write("Testing" + i.ToString());
writer.Write("</br>");
this.Controls.Add(btn);
writer.AddAttribute(HtmlTextWriterAttribute.Href, Link);
// writer.AddAttribute(HtmlTextWriterAttribute.Id);
writer.RenderBeginTag(HtmlTextWriterTag.A);
writer.Write("Link");
writer.RenderEndTag();
writer.RenderEndTag();
//writer.WriteBeginTag("p");
// // Does Something
//writer.WriteEndTag("p");
writer.RenderEndTag();
writer.RenderEndTag();
writer.RenderEndTag();
i++;
}
}
Advert1.Text = stringWriter.ToString();
}
Master Page.aspx
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="MasterPage.master.cs" Inherits="Lenders.ie.MasterPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Shop Homepage - Start Bootstrap Template</title>
<!-- Bootstrap Core Content -->
<link href="Content/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="Content/shop-homepage.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<form id="form1" runat="server">
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<%-- <a class="navbar-brand" href="www.google.com">
</a>--%>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li>
<asp:HyperLink ID="Home" runat="server">Home</asp:HyperLink>
</li>
<li>
<asp:HyperLink ID="Services" runat="server">Services</asp:HyperLink>
</li>
<li>
<asp:HyperLink ID="Contact" runat="server">Contact</asp:HyperLink>
</li>
<li>
<asp:HyperLink ID="Login" runat="server">Log In</asp:HyperLink>
</li>
</ul>
<div class="navbar-form navbar-right">
<div class="input-group input-sm">
<asp:TextBox ID="txtSearch" runat="server" CssClass="form-control form-control-sm " AutoPostBack="true"></asp:TextBox>
<span class="
</span>
</div>
</div>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-3">
<p class="lead">Shop Name</p>
<div class="list-group">
<asp:HyperLink ID="HyperLink1" CssClass="list-group-item" runat="server">Sports</asp:HyperLink>
<asp:HyperLink ID="HyperLink2" CssClass="list-group-item" runat="server">Hobbies</asp:HyperLink>
<asp:HyperLink ID="HyperLink3" CssClass="list-group-item" runat="server">Life Style</asp:HyperLink>
<asp:HyperLink ID="HyperLink4" CssClass="list-group-item" runat="server">Another Example</asp:HyperLink>
<asp:HyperLink ID="HyperLink5" CssClass="list-group-item" runat="server"> Blah </asp:HyperLink>
</div>
</div>
<%-- <div class="col-md-9">
<div class="row carousel-holder">
<div class="col-md-12">--%>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
<%-- </div>
</div>
</div>--%>
<div class="container">
<hr>
<!-- Footer -->
<footer>
<div class="row">
<div class="col-lg-12">
<p>Copyright © Your Website 2014</p>
</div>
</div>
</footer>
</div>
<!-- /.container -->
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>enter code here
</form>
</body>
</html>
Master Page.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Lenders.ie
{
public partial class MasterPage : System.Web.UI.MasterPage
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
}
I have a simple button, that when clicked should display text in a label. However when I press the button, nothing happens. Any ideas where i could be going wrong?
Default.aspx:
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default"%>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<asp:Button ID="testbutton" runat="server" Text="Button" OnClick="testbutton_Click" />
<asp:Label ID="testlabel" runat="server"></asp:Label>
</asp:Content>
Default.aspx.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Data;
using System.Data.SqlClient;
using System.Web.Configuration;
public partial class Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void testbutton_Click(object sender, EventArgs e)
{
testlabel.Text = "You clicked the Testbutton";
}
}
Masterpage:
<%# Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>PhotoChunk</title>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<link href="css/style.css" rel='stylesheet' type='text/css' />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'/>
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<script src="js/jquery.min.js"></script>
<!--<script src="js/jquery.easydropdown.js"></script>-->
<!--start slider -->
<link rel="stylesheet" href="css/fwslider.css" media="all" />
<script src="js/jquery-ui.min.js"></script>
<script src="js/fwslider.js"></script>
<!--end slider -->
<script type="text/javascript">
$(document).ready(function() {
$(".dropdown img.flag").addClass("flagvisibility");
$(".dropdown dt a").click(function() {
$(".dropdown dd ul").toggle();
});
$(".dropdown dd ul li a").click(function() {
var text = $(this).html();
$(".dropdown dt a span").html(text);
$(".dropdown dd ul").hide();
$("#result").html("Selected value is: " + getSelectedValue("sample"));
});
function getSelectedValue(id) {
return $("#" + id).find("dt a span.value").html();
}
$(document).bind('click', function(e) {
var $clicked = $(e.target);
if (! $clicked.parents().hasClass("dropdown"))
$(".dropdown dd ul").hide();
});
$("#flagSwitcher").click(function() {
$(".dropdown img.flag").toggleClass("flagvisibility");
});
});
</script>
<!----details-product-slider--->
<!-- Include the Etalage files -->
<link rel="stylesheet" href="css/etalage.css" />
<script src="js/jquery.etalage.min.js"></script>
<!-- Include the Etalage files -->
<script>
jQuery(document).ready(function($){
$('#etalage').etalage({
thumb_image_width: 600,
thumb_image_height: 400,
show_hint: true,
click_callback: function(image_anchor, instance_id){
alert('Callback example:\nYou clicked on an image with the anchor: "'+image_anchor+'"\n(in Etalage instance: "'+instance_id+'")');
}
});
// This is for the dropdown list example:
$('.dropdownlist').change(function(){
etalage_show( $(this).find('option:selected').attr('class') );
});
});
</script>
<!----//details-product-slider--->
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div class="header">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="header-left">
<div class="logo">
<img src="images/logowhite.png" alt=""/>
</div>
<div class="menu">
<a class="toggleMenu" href="#"><img src="images/nav.png" alt="" /></a>
<ul class="nav" id="nav">
<li>Browse</li>
<li>Upload</li>
<li>About</li>
</ul>
<script type="text/javascript" src="js/responsive-nav.js"></script>
</div>
<div class="clear"></div>
</div>
<div class="header_right">
<!-- start search-->
<div class="search-box">
<div id="sb-search" class="sb-search">
<form>
<input class="sb-search-input" placeholder="What are you looking for?" type="search" name="search" id="search">
<input class="sb-search-submit" type="submit" value="">
<span class="sb-icon-search"> </span>
</form>
</div>
</div>
<!----search-scripts---->
<script src="js/classie.js"></script>
<script src="js/uisearch.js"></script>
<script>
new UISearch(document.getElementById('sb-search'));
</script>
<!----//search-scripts---->
<ul class="icon1 sub-icon1 profile_img">
<li><a class="active-icon c1" href="#"> </a>
<ul class="sub-icon1 list">
<li class="list_img"><img src="images/1.jpg" alt=""/></li>
<li class="list_desc"><h4>Matthew Thompson</h4></li>
<li><div class="login_buttons">
<div class="check_button">Account</div>
<div class="login_button">Logout</div>
</div>
<div class="clear"></div>
</li>
</ul>
</li>
</ul>
<div class="clear"></div>
</div>
</div>
</div>
</div>
</div>
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="footer">
<div class="container">
<div class="row">
<div class="col-md-3">
<ul class="footer_box">
<h4>About PhotoChunk</h4>
<li>About Us</li>
<li>Privacy Policy</li>
</ul>
</div>
<div class="col-md-3">
<ul class="footer_box">
<h4>Support</h4>
<li>Contact Us</li>
<li>Help</li>
</ul>
</div>
<div class="col-md-3">
<ul class="footer_box">
<ul class="social">
<li class="facebook"><span> </span></li>
<li class="twitter"><span> </span></li>
<li class="instagram"><span> </span></li>
<li class="pinterest"><span> </span></li>
<li class="youtube"><span> </span></li>
</ul>
</ul>
</div>
</div>
</div>
</div>
</form>
</body>
</html>
I was able to get it working!
By deleting the extra form tags found in the master page, the button now works.
<div id="sb-search" class="sb-search">
<form>
<input class="sb-search-input" placeholder="What are you looking for?" type="search" name="search" id="search">
<input class="sb-search-submit" type="submit" value="">
<span class="sb-icon-search"> </span>
</form>
</div>
Before I add in this part of session code, it will redirect me to BlogEntry.aspx if my username and password is correct. After I add in the session code, when I clicked the button nothing happening. Can you help me convert my session code to work in the javascript? I need to code it in the javascript and not in the code behind because I am using a html button. Because I want the design of the button, I need to do this. Unless you tell me there's a way to do it in the code behind. After login in login.aspx. It will redirect to logined.aspx and display welcome admin in the label.
Login.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
</style>
<link rel="stylesheet" type="text/css" href="stylesheets/loginstyle.css" />
<script language="javascript" type="text/javascript">
// <![CDATA[
function Button1_onclick() {
if (document.getElementById('txtUserName').value == "Admin" && document.getElementById('txtPassword').value == "123") {
//After add in session it cannot redirect START HERE
Session.Add("Username", txtUserName.Value);
Session.Add("Password", txtPassword.Value);
FormsAuthentication.SetAuthCookie(txtUserName.Value, true);
window.location.assign("BlogEntry.aspx")
//After add in session it cannot redirect END HERE
}
else
{
document.getElementById("<%=lblError.ClientID%>").innerHTML = "Name can't be blank!";
}
}
// ]]>
</script>
</head>
<body>
<div id="wrapper">
<form name="login-form" class="login-form" action="" method="post">
<div class="header">
<h1>Login Form</h1>
<span>Fill out the form below to login to my super awesome imaginary control panel.</span>
</div>
<div class="content">
<input name="username" type="text" class="input username" placeholder="Username" runat="server" id="txtUserName" />
<div class="user-icon"></div>
<input name="password" type="password" class="input password" placeholder="Password" runat="server" id="txtPassword" />
<div class="pass-icon"></div>
</div>
<div class="footer">
<input type="button" name="submit" value="Login" class="button" runat="server" id="Button1" önserverclick="Button1_Click" onclick="return Button1_onclick()" />
<asp:Label ID="lblError" runat="server" Text=""></asp:Label>
</div>
</form>
</div>
<div class="gradient"></div>
</body>
</html>
Logined.aspx
protected void Page_Load(object sender, EventArgs e)
{
//Logout.Visible = false;
string memName = (String)Session["UserName"];
lblUsername.Text = String.Concat("Welcome Guest!");
if (Session["Username"] != null && Session["Username"] != String.Empty)
{
lblUsername.Text = "Welcome, " + memName + "!";
}
}
For #Sangram
You can use html session storage or localStorage to store your key values. this will not need any server side code. The info will be there even if the user close the browser.
for browser compatibility: http://www.html5rocks.com/en/features/storage
for example: http://coding.smashingmagazine.com/2010/10/11/local-storage-and-how-to-use-it/
I want to read html content along with attributes added by jquery from code behind in string variable.
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs"
Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<style type="text/css">
#form1{width:60%; height:60%; margin:auto; background-color:White;}
html,body{height:100%; width:100%; background-color:Silver; font:100%;}
#sidePanel{height:50%; width:17%; float:left;}
.light{border:5px solid; border-radius:25px;}
</style>
<script src="Javascript/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="Javascript/jquery.corner.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
});
function handleClick(light) {
$('#form1').addClass("light");
$('#test').addClass("light");
}
</script>
</head>
<body>
<div id="sidePanel" runat="server">
Residence Name<br />
<input type="radio" name="light" value="With Light" onclick="handleClick(this);"/>With
Light<br/>
<input type="radio" name="light"value="Without Light"
onclick="handleClick(this);"/>Without Light<br /><br />
Office Name Plate<br />
<input type="radio" name="light" runat="server" value="With Light Plate"
onclick="handleClick(this);"/>With Light<br/>
<input type="radio" name="light" runat="server" value="Without Light Plate"
onclick="handleClick(this);"/>Without Light<br /><br />
Table Top Name Plate<br />
<input type="radio" name="light" runat="server" value="With Light Table"
onclick="handleClick(this);"/>Table Top<br/><br />
Cubical / Door Name Plate<br />
<input type="radio" name="light" runat="server" value="With Light Table"
onclick="handleClick(this);"/>Cubicle / Door<br/>
<form runat="server">
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:Button ID="btnSave" runat="server" Text="Button" onclick="btnSave_Click"
style="height: 26px" />
</form>
</div>
<div id="form1" runat="server">
<div id="test"></div>
</div>
</body>
</html>
Below is the code behind:
protected void btnSave_Click(object sender, EventArgs e)
{
string a=form1.InnerHtml;
}
form1.innerhtml does not contain the class="light" attribute in div tag how
Have you tried to access the class using the .CssClass property?
protected void btnSave_Click(object sender, EventArgs e)
{
string a=form1.CssClass;
}