DOT NET : February 2015

SHOW ALERT POP UP REMAINDER SCHEDULAR USING MASTER PAGE.

File->New->WebSite

Master Page Design

Design

<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div>
<table>
<tr>
<td>Uday Blog Spot
</td>
<td>http://dotnetbyudayrajakonda.blogspot.in/
</td>
</tr>
<tr>
<td colspan="2">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"></asp:ContentPlaceHolder>
</td>
</tr>
</table>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick"></asp:Timer>
</div>
<div class='popup' style="position: fixed; margin-right: 50px; width: 300px; height: 200px" id="divRemainder">

</div>
</form>
</body>

styles

<style type="text/css">
.popup{
background-color: #F4F4F4;
border: 7px solid #545353 !important;
border-radius: 5px 5px 5px 5px;
-webkit-box-shadow: 0 1px 12px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 0 1px 12px rgba(0, 0, 0, 0.6);
box-shadow: 0 1px 12px rgba(0, 0, 0, 0.6);
display: none;
}

.content {
min-width: 600px;
width: 600px;
min-height: 150px;
margin: 100px auto;
background: #f3f3f3;
position: relative;
z-index: 103;
padding: 10px;
border-radius: 5px;
box-shadow: 0 2px 5px #000;
margin-right: 42%;
}
</style>

java script function

<script type="text/javascript">
function myFunction() {
var string = MasterPage2.RemainderDetails();
$('#divRemainder').append(string.value);
$('.popup').show();
return false;
}

</script>

MasterPage.cs

[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
public string RemainderDetails()
{
SqlConnection con = new SqlConnection("");
SqlCommand cmd = new SqlCommand("", con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
DataTable _dataTable = ds.Tables[0];
StringBuilder sb = new StringBuilder();
int count = _dataTable.Rows.Count;
if (count > 0)
{
sb.Append("<table width='100%' cellspacing='0' cellpadding='0' border='0'>");
sb.Append("<thead class='tableHeadBg'><tr>");
sb.Append("</tr></thead>");
sb.Append("<tbody class='tableTbodyBg'>");
for (int i = 0; i < count; i++)
{
sb.Append("<tr>");
sb.Append("<td width='10%' align='left'>");
sb.Append(Convert.ToString(_dataTable.Rows[i]["Appointment"]));
sb.Append("</td>");
sb.Append("<td width='10%' align='left'>");
sb.Append(Convert.ToString(_dataTable.Rows[i]["RemainderStartDate"]));
sb.Append("</td>");
sb.Append("</tr>");
}
sb.Append("</tbody></table>");
}
return sb.ToString();
}

Add Content Page as Follows

Content Page

contentPage.cs(Need not write any code in Default Page as the code need to be written in Master Page.

Output:

jQuery Accordion using ASP.NET

Download the following js files from the below url.

http://jqueryui.com/download/

Default.aspx:

$(function () {

$("#accordion").accordion();

});

</script>

<body>

<asp:Repeater ID="rptAccordianDetails" runat="server">

<h3>

<%# Eval("Countryname") %></h3>

<p>

<%# Eval("CountryDescription") %>

</p>

</ItemTemplate>

</asp:Repeater>

</div>

</form>

</body>

.cs page

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

BindData();

}

public void BindData()

{

SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["dbtaskallocation"].ToString());

SqlCommand cmd = new SqlCommand("select * from country", con);

SqlDataAdapter da = new SqlDataAdapter(cmd);

DataSet ds = new DataSet();

da.Fill(ds);

rptAccordianDetails.DataSource = ds;

rptAccordianDetails.DataBind();

}

Output:

Save Images in GridView and Display in GridView.

Design the Form as Follows:

<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
<asp:Label ID="Label1" runat="server" Text="EmpId"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox1" runat="server" MaxLength="3"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label2" runat="server" Text="Ename"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox2" runat="server" Style="margin-top: 0px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label3" runat="server" Text="Emp Image"></asp:Label>
</td>
<td>
<asp:FileUpload ID="FileUpload1" runat="server" />
</td>
</tr>
<tr>
<td>
<asp:Button ID="Button1" runat="server" Text="Save" OnClick="Button1_Click" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label4" runat="server"></asp:Label>
</td>
</tr>
</table>
</div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="FALSE">
<Columns>
<asp:BoundField HeaderText="EmpId" DataField="EmpId" />
<asp:BoundField HeaderText="Ename" DataField="Ename" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl='<%# "Handler.ashx?ImID="+ Eval("EmpId") %>' Height="150px" Width="150px" />
</ItemTemplate>
</asp:TemplateField>
</Columns>

</asp:GridView>

</form>

.cs Page

string sqlc = System.Configuration.ConfigurationManager.ConnectionStrings["SqlConnection"].ToString();
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGrid();
}
}

protected void Button1_Click(object sender, EventArgs e)
{
SqlConnection con = new SqlConnection(sqlc);
SqlCommand cmd=new SqlCommand();
Stream fs = FileUpload1.PostedFile.InputStream;
BinaryReader br = new BinaryReader(fs);
Byte[] bytes = br.ReadBytes((Int32)fs.Length);
con.Open();
cmd.Parameters.AddWithValue("@EmpId", Convert.ToInt32(TextBox1.Text));
cmd.Parameters.AddWithValue("@Ename", TextBox2.Text.ToString());
cmd.Parameters.Add("@Eimage", SqlDbType.Binary).Value = bytes;
cmd.Connection=con;
cmd.CommandText = "insert into EmpImg(EmpId,Ename,Eimage)values(@EmpId,@Ename,@Eimage)";
cmd.ExecuteNonQuery();
con.Close();
Label4.Text = "Data inserted";
BindGrid();
}

public void BindGrid()
{
SqlConnection con = new SqlConnection(sqlc);
SqlCommand cmd = new SqlCommand("select * from EmpImg", con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataTable dt = new DataTable();
da.Fill(dt);
GridView1.DataSource = dt;
GridView1.DataBind();
}

Add New Item

Write the following Code in Handler

using System;
using System.Web;

public class Handler : IHttpHandler {

public void ProcessRequest(HttpContext context)
{
string strcon = System.Configuration.ConfigurationManager.ConnectionStrings["SqlConnection"].ToString();
string imageid = context.Request.QueryString["ImID"];
System.Data.SqlClient.SqlConnection connection = new System.Data.SqlClient.SqlConnection(strcon);
connection.Open();
System.Data.SqlClient.SqlCommand command = new System.Data.SqlClient.SqlCommand("select Eimage from EmpImg where EmpId=" + imageid, connection);
System.Data.SqlClient.SqlDataReader dr = command.ExecuteReader();
dr.Read();
context.Response.BinaryWrite((Byte[])dr[0]);
connection.Close();
context.Response.End();
}

public bool IsReusable {
get {
return false;
}
}

}

Output:

jQUERY ZOOM IN AND ZOOM OUT

Download the jquery file.

panzoom.js

And design the form as follows:

<head>
<title>Panzoom for jQuery</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
body {
background: #F5FCFF;
color: #333666;
}

section {
text-align: center;
margin: 50px 0;
}

.panzoom-parent {
border: 2px solid #333;
}

.panzoom-parent .panzoom {
border: 2px dashed #666;
}

.buttons {
margin: 40px 0 0;
}

.panzoom {
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
transform-origin: 0 0;
}
</style>
<script src="../test/libs/jquery.js"></script>
<script src="../dist/jquery.panzoom.js"></script>
</head>

<body>
<section>
<div class="parent">
<div class="panzoom">
<iframe src="http://www.w3schools.com" width="100%" height="100%"></iframe>
</div>
</div>
<div class="buttons">
<button class="zoom-in">Zoom In</button>
<button class="zoom-out">Zoom Out</button>
<input type="range" class="zoom-range">
<button class="reset">Reset</button>
</div>
<script>
(function () {
var $section = $('section').first();
$section.find('.panzoom').panzoom({
$zoomIn: $section.find(".zoom-in"),
$zoomOut: $section.find(".zoom-out"),
$zoomRange: $section.find(".zoom-range"),
$reset: $section.find(".reset")
});
})();
</script>
</section>
</body>

Output:

Wednesday, 25 February 2015

SHOW ALERT POP UP REMAINDER SCHEDULAR USING MASTER PAGE.

jQuery Accordion using ASP.NET

Save Images in GridView and Display in GridView.

jQUERY ZOOM IN AND ZOOM OUT