How to use Master and Content page

March 22, 2013 Posted by Unknown at 02:28:00 | Labels: ASP.NET MASTER PAGE EXAMPLE

MasterPage.master

<%@ Master Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>asp.net master page example: how to use master and content page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h1 style="color:Red">My Site</h1>
<hr />
<table>
<tr valign="top">
<td>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</td>
<td>
<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
</td>
</tr>
</table>
<hr />
<div style="color:Gray">Page footer</div>
</div>
</form>
</body>
</html>

ContentPage.aspx

view plain copy to clipboard print ?

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" Title="" %>
<script runat="server">
</script>
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
<asp:Calendar
ID="Calendar1"
runat="server"
BackColor="Orange"
BorderColor="DarkOrange"
ForeColor="Snow"
>
<TitleStyle BackColor="DarkOrange" />
<SelectedDayStyle BackColor="Crimson" />
</asp:Calendar>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
<asp:Image
ID="Image1"
runat="server"
ImageUrl="~/Images/sunset.jpg"
/>
</asp:Content>

ContentPage2.aspx

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" Title="" %>
<script runat="server">
</script>
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
<asp:Calendar
ID="Calendar1"
runat="server"
BackColor="DodgerBlue"
BorderColor="DarkBlue"
ForeColor="Snow"
>
<TitleStyle BackColor="DarkBlue" />
<SelectedDayStyle BackColor="LightBlue" ForeColor="DarkBlue" />
</asp:Calendar>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
<asp:Image
ID="Image1"
runat="server"
ImageUrl="~/Images/sea_beach2.jpg"
Width="50%"
Height="50%"
/>
</asp:Content>

How to display data in grid view

March 21, 2013 Posted by Unknown at 22:01:00 | Labels: GRID VIEW EXAMPLE

DISPLAYSTUDENT.ASPX.CS

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Data.SqlClient;
public partial class DisplayUsers : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack == false)
        {
            SqlConnection con = new SqlConnection(DataBase.connect);
            SqlDataAdapter da = new SqlDataAdapter("select * from Stud_Info", con);
            SqlCommandBuilder cm = new SqlCommandBuilder(da);
            DataSet ds = new DataSet();
            da.Fill(ds, "Stud_Info");
            if (ds.Tables["Stud_Info"].Rows.Count > 0)
            {
                GridView1.DataSource = ds.Tables["Stud_Info"];
                GridView1.DataBind();
            }
        }
    }
    protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
    {

    }
    protected void Button1_Click(object sender, EventArgs e)
    {

    }
}

DISPLAYSTUDENT.ASPX

<%@ Page Language="C#" MasterPageFile="~/Hostel.master" AutoEventWireup="true" CodeFile="DisplayStudent.aspx.cs" Inherits="DisplayUsers" Title="DisplayStudent" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            height: 16px;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <table class="style1">
        <tr>
            <td align="center" colspan="2">
                <asp:Label ID="Label1" runat="server" Text="Student Details" Font-Size="Medium"></asp:Label>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                 </td>
        </tr>
        <tr>
            <td class="style2" colspan="2">
                <asp:Panel ID="Panel1" runat="server" ScrollBars="Both" Height="471px"
                    Width="682px">
                    <asp:GridView ID="GridView1" runat="server" BackColor="White"
                        BorderColor="#CC9966" BorderStyle="None"
                        BorderWidth="1px" CellPadding="4"
                        Height="467px" Width="682px"
                           onselectedindexchanged="GridView1_SelectedIndexChanged">
                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                        <FooterStyle BackColor="#5D7B9D" ForeColor="White" Font-Bold="True" />
                        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                        <EditRowStyle BackColor="#999999" />
                        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                    </asp:GridView>
                </asp:Panel>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                 </td>
        </tr>
        <tr>
            <td>
                 </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td>
                 </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td>
                <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Back"
                    Width="151px" />
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td>
                 </td>
            <td>
                 </td>
        </tr>
    </table>

</asp:Content>

Student Details

Stud_ID	Stud_Name	Stud_Year	Stud_Address	Stud_City	Stud_State	Stud_Country	Stud_Email	Hostel	Stud_Phone	Stud_Fee	Entry_Date	Exit_Date	Stud_Room	F_EID
500006101	Koyyana Venkata Sarthak	First	Azad Nagar	Delhi	Delhi	India	koyyana@ymail.com	Bravo	9050383232	Paid	3/8/2013 12:00:00 AM	3/20/2013 12:00:00 AM	45	ter@gmail.com
500012328	Partha Mehrotra	Second	New Model town	Assam	Assam	India	partha@gmail.com	Bravo	9876543212	Paid	3/12/2013 12:00:00 AM	3/21/2013 12:00:00 AM	09	gmail@gmail.com
500012717	Kshitij Deopa	Third	Modeltown	Panipat	Haryana	India	deopa@gmail.com	Bravo	9823456654	Paid	3/7/2013 12:00:00 AM	3/18/2013 12:00:00 AM	88
500017072	Sachin Agarwal	Second	H.No 465 Kirti Nagar	Delhi	Delhi	India	sachin@gmai.com	Alpha	9723454345	Pending			13	sachin@gmail.com
500543250	Sumit	First	Panipat	panipat	haryana	Sri Lanka	esh@gmail.com	Alpha	3214509876	Pending	3/14/2013 12:00:00 AM		23
500543255	Sumit	First	Panipat	panipat	haryana	Sri Lanka	esh@gmail.com	Alpha	3214509876	Pending	3/14/2013 12:00:00 AM		23
500564399	Yogesh	Second	Panipat	panipat	haryana	China	es@gmail.com	Charlie	9070575432	Pending	3/12/2013 12:00:00 AM		45
500959312	Rohit	First	Delhi	Delhi	Delhi	India	rohit@gmail.com	Delta	9896092048	Paid	2/25/2013 12:00:00 AM		32
505967521	Anil	First	Delhi	Delhi	Haryana	India	anil@gmail.com	Alpha	9896097048	Pending	3/13/2013 12:00:00 AM	3/22/2013 12:00:00 AM	10

Ajax Rating - How to use OnChanged event in asp.net Rating

March 20, 2013 Posted by Unknown at 21:59:00 | Labels: Azax Examples

RatingOnChangedEvent.aspx

<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Rating1_Changed(object sender, EventArgs e)
{
int ratingValue = Rating1.CurrentRating;
if (ratingValue <= 3)
{
Label1.ForeColor = System.Drawing.Color.Red;
}
else
{
Label1.ForeColor = System.Drawing.Color.Green;
}
Label1.Text = "You Rated: " + ratingValue;
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Ajax Rating - How to use OnChanged event in asp.net Rating</title>
<style type="text/css">
.StarCss {
background-image: url(/Image/star.png);
height:24px;
width:24px;
}
.FilledStarCss {
background-image: url(/Image/filledstar.png);
height:24px;
width:24px;
}
.EmptyStarCss {
background-image: url(/Image/star.png);
height:24px;
width:24px;
}
.WaitingStarCss {
background-image: url(/Image/waitingstar.png);
height:24px;
width:24px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2 style="color:DarkBlue; font-style:italic;">
ASP.NET Ajax Rating - How to use OnChanged
<br /> event in asp.net Rating
</h2>
<hr width="500" align="left" color="LightBlue" />
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<table border="0" cellpadding="4" cellspacing="4">
<tr>
<td>
<asp:Image
ID="Image1"
runat="server"
ImageUrl="~/Image/RedBird.jpg"
Height="250"
/>
</td>
<td>
<asp:Label
ID="Label1"
runat="server"
Font-Size="X-Large"
Font-Italic="true"
Font-Names="Comic Sans MS"
>
</asp:Label>
<br /><br />
<asp:Label
ID="Label2"
runat="server"
ForeColor="SandyBrown"
Font-Size="Large"
Text="Rate this image"
>
</asp:Label>
<br />
<asp:Rating
ID="Rating1"
runat="server"
StarCssClass="StarCss"
FilledStarCssClass="FilledStarCss"
EmptyStarCssClass="EmptyStarCss"
WaitingStarCssClass="WaitingStarCss"
AutoPostBack="true"
OnChanged="Rating1_Changed"
>
</asp:Rating>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>

How to create and apply CSS style programmatically in asp.net control

Posted by Unknown at 03:32:00 |

CreateAndApplyCSSStyle.aspx

<%@ Page Language="C#" AutoEventWireup="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Button1_Click(object sender, System.EventArgs e)
{
BulletedList1.Style.Add("Padding", "10px 25px 10px 55px");
BulletedList1.Style.Add("font-family", "Courier New");
BulletedList1.Style.Add("font-size", "x-large");
BulletedList1.Style.Add("font-style", "italic");
BulletedList1.Style.Add("text-decoration", "underline");
BulletedList1.Style.Add("border", "2px dotted darkred");
BulletedList1.Style.Add("background-color", "pink");
BulletedList1.Style.Add("color", "deeppink");
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>How to create and apply CSS style programmatically in asp.net control</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2 style="color:MidnightBlue; font-style:italic;">
How to create and apply CSS style
<br /> programmatically in asp.net control
</h2>
<hr width="450" align="left" color="SkyBlue"/>
<asp:BulletedList
ID="BulletedList1"
runat="server"
Width="500"
BackColor="Crimson"
ForeColor="Snow"
>
<asp:ListItem>Crimson</asp:ListItem>
<asp:ListItem>MidnightBlue</asp:ListItem>
<asp:ListItem>CornFlower</asp:ListItem>
<asp:ListItem>DarkSalmon</asp:ListItem>
<asp:ListItem>IndianRed</asp:ListItem>
<asp:ListItem>OliveDrab</asp:ListItem>
</asp:BulletedList>
<asp:Button
ID="Button1"
runat="server"
OnClick="Button1_Click"
Text="Create And Apply CSS Style In BulletedList"
Height="45"
Font-Bold="true"
ForeColor="DarkBlue" />
</div>
</form>
</body>
</html>
Demo

Ajax updatepanel example with triggers in Asp.Net

March 19, 2013 Posted by Unknown at 03:03:00 | Labels: Azax Examples

Introduction:

In this article I will explain what is Ajax updatepanel control, advantages of updatepanel control and how to use multiple updatepanels in asp.net.

Description:

Previously I explained many articles relating to Ajax. Now I will explain what is ajax updatepanel control and use of ajax updatepanel control in asp.net.

During work with our applications if we entered any values in textbox controls and click on a button in form we will see full postback of our page and we will lost all the controls values whatever we entered previously this happend because of postback. If we want to avoid this full postback of page and round trip to server we need to write much code instead of writing much code we can use ajax updatepanel control.

Ajax updatepanel will help us to avoid full postback of the page i.e., avoid refresh of the whole page content with postback and stop flickering of the page which is associated with a postback and allows only partial postbacks. By using Ajax updatepanel we can refresh only required part of page instead of refreshing whole page.

Ajax updatepanel contains property called UpdateMode this property is used to specify whether UpdatePanel is always refreshed during a partial render or if it refresh only when a particular trigger hit. By default updatepanel contains UpdateMode="Always" if we want to set it conditionally we need to change this property UpdateMode="Conditional"

Ajax updatepanel control contains two child tags those are ContentTemplate and Triggers.

a palpable is the antidote for civilization.

ContentTemplate is used to hold the content of the page means suppose we designed page with some controls we will place controls inside of the ContentTemplate

Triggers we used in a situation like need to refresh updatepanel only whenever I click some button control in that situation I will define those controls with this Triggers child tag.

Our Sample update panel control will be like this

<asp:UpdatePanel ID="UpdatePanel2" runat="server"

UpdateMode="Conditional">

<asp:Label ID="Label2" runat="server"

ForeColor="red" />

……………………………………………………..

………………………………………………………

……………………………………………………….

</ContentTemplate>

<asp:AsyncPostBackTrigger ControlID="Button1"

EventName="Click" />

</Triggers>

</asp:UpdatePanel>

Now we will create one sample application with updatepanels for that first create application and design your aspx page will be likes this

<title>UpdatePanel Example in asp.net</title>

</head>

<body>

<asp:ScriptManager ID="ScriptManager1" runat="server"/>

<div>

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

<legend>Update Panel-1</legend>

<asp:Label ID="lbl1" runat="server" ForeColor="green"/><br />

<asp:Button ID="btnUpdate1" runat="server" Text="Update Both Panels" OnClick="btnUpdate1_Click" />

<asp:Button ID="btnUpdate2" runat="server" Text="Update This Panel" OnClick="btnUpdate2_Click" />

</fieldset>

</ContentTemplate>

</asp:UpdatePanel>

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">

<legend>Update Panel-2</legend>

<asp:Label ID="lbl2" runat="server" ForeColor="red" />

</fieldset>

</ContentTemplate>

<asp:AsyncPostBackTrigger ControlID="btnUpdate1" EventName="Click" />

</Triggers>

</asp:UpdatePanel>

</div>

</form>

</body>

</html>

If you observe above code in UpdatePanel2 I defined Triggers property with btnUpdate1. Here UpdatePanel2 content will update only whenever we click on btnUpdate1 because we defined UpdatePanel2 property UpdateMode="Conditional" and we set AsyncPostBackTrigger property with btnUpdate1

Write following code in code behind

C#.NET

protected void btnUpdate1_Click(object sender, EventArgs e)

{

lbl1.Text = DateTime.Now.ToLongTimeString();

lbl2.Text = DateTime.Now.ToLongTimeString();

}

protected void btnUpdate2_Click(object sender, EventArgs e)

{

lbl1.Text = DateTime.Now.ToLongTimeString();

lbl2.Text = DateTime.Now.ToLongTimeString();

}

VB Code

Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)

End Sub

Protected Sub btnUpdate1_Click(ByVal sender As Object, ByVal e As EventArgs)

lbl1.Text = DateTime.Now.ToLongTimeString()

lbl2.Text = DateTime.Now.ToLongTimeString()

End Sub

Protected Sub btnUpdate2_Click(ByVal sender As Object, ByVal e As EventArgs)

lbl1.Text = DateTime.Now.ToLongTimeString()

lbl2.Text = DateTime.Now.ToLongTimeString()

End Sub

Demo

If you observe above sample whenever I click on button “Update Both Panels” it’s updating data in both updatepanels but if click on button “Update This Panel” it’s updating data in first updatepanel because in both updatepanels we defined condition UpdateMode= "Conditional" and set Triggers conditions because of that here updatepanels will update conditionally and in UpdatePanel2 we written AsyncPostBackTrigger property to update panel only whenver we click on btnUpdate1.

<a href="https://plus.google.com/104448558101212792097" rel="publisher">Google+</a>

Asp.Net Examples

Pages

How to use Master and Content page

How to display data in grid view

Ajax Rating - How to use OnChanged event in asp.net Rating

How to create and apply CSS style programmatically in asp.net control

Ajax updatepanel example with triggers in Asp.Net

Recent Posts

Tags 2

Flickr

Tags 1

Download

Etiquetas

Tags 3

Tags 4

Popular Posts

Blog Archive