Dynamic Metatag In asp.net c# , Dynamic metatag in master Page

In 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 id="Head1" runat="server">
<title id="PageTitle" runat="server">This is the Default Page Title...</title>
<meta name="Keywords" id="PageKeywords" content="default, page, keywords" runat="server" />
<meta name="Description" id="PageDescription" content="This is the Default page desctription, which should be changed when the page is loaded." runat="server" /> 

 In Master Page .cs file :

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class MasterPage : System.Web.UI.MasterPage
{
    protected void Page_Load(object sender, EventArgs e)
    {
   
    }

    public string MetaTitle
    {
        get
        {
            return PageTitle.Text;
        }
        set
        {
            PageTitle.Text = value;
        }
    }
    public string MetaKeywords
    {
        get
        {
            return PageKeywords.Content;
        }
        set
        {
            PageKeywords.Content = value;
        }
    }
    public string MetaDescription
    {
        get
        {
            return PageDescription.Content;
        }
        set
        {
            PageDescription.Content = value;
        }
    }
}
 

Default.aspx.cs Page :

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        MasterPage myMaster = (MasterPage)this.Master;
        myMaster.MetaTitle = "This is the new Page Title, which is set upon Page_Load";
        myMaster.MetaDescription = "Hitendra";
        myMaster.MetaKeywords = "new, page, keywords, set, upon, page, load";
    }
}

 

Light Weight PopUp

Here we have a javascript and CSS code to create a light weight popups

on Code Behind

<div>
<input id="Button1" type="button" value="Click To Popup" onclick="ShowDiv('DivOrderSearch','DivLayer')" />
</div>
  <div id="DivLayer" class="DialogueBackground">
</div>
<div id="DivOrderSearch" style="width: 400px; height: 300px; background-color: #D9E0E6;"
  class="Dialogue">
  <div class="DialogueTitle">
Popup Sample
</div>
  <div class="DialogueImg" onclick="HideDiv('DivOrderSearch');" title="Close">
</div>
<div style="padding: 10px;">
Hello World
</div>
</div>

Add javascripts

function HideDiv(PopUpDiv) {
var DivPopUp = document.getElementById(PopUpDiv);
var DivLayer = document.getElementById('DivLayer');
DivPopUp.style.display = "none";
DivLayer.style.width = "0%";
}
function ShowDiv(PopUpDiv, LayerDiv) {
var DivPopUp = document.getElementById(PopUpDiv);
var DivLayer = document.getElementById(LayerDiv);
DivPopUp.style.display = "block";
DivLayer.style.width = "100%";
DivPopUp.style.top = document.documentElement.clientHeight / 2 - DivPopUp.style.height.replace('px', '') / 2 + 'px';
DivPopUp.style.left = document.body.offsetWidth / 2 - DivPopUp.style.width.replace('px', '') / 2 + 'px';
return false;
}

Few Css Classes

.DialogueBackground
{
background-color: Gray;
filter: alpha(opacity=50);
opacity: 0.50;
position: fixed;
left: 0;
top: 0;
width: 0%;
height: 100%;
}

.Dialogue
{
background-color: White;
display: none;
z-index: 2;
border: 1px solid Black;
position: fixed;
text-align: center;
}
.DialogueImg
{
height: 30px;
position: absolute;
width: 27px;
float: right;
background-image: url(../images/closebox.png);
cursor: pointer;
right: -15px;
top: -15px;
background-repeat: no-repeat;
border: 0;
}
.DialogueTitle
{
font-size: small;
font-weight: bolder;
padding: auto;
height: 25px;
color: #ffffff;
position: relative;
background: url(../images/app_tab2.jpg) repeat-x;
top: 0px;
}

Maintain Scroll Position after Asynchronous Postback

<script type="text/javascript">
    var xPos, yPos;
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_beginRequest(BeginRequestHandler);
    prm.add_endRequest(EndRequestHandler);
    function BeginRequestHandler(sender, args) {
        xPos = $get('scrollDiv').scrollLeft;
        yPos = $get('scrollDiv').scrollTop;
    }
    function EndRequestHandler(sender, args) {
        $get('scrollDiv').scrollLeft = xPos;
        $get('scrollDiv').scrollTop = yPos;
    }
</script>

Vaidation Of Email Address

JavaScript Code HTML code

Enter an Email Address :

Get Code From Here: http://www.smartwebby.com/dhtml/email_validation.asp

Calendar for Date Input

The code

<!-- include jQuery FORM Tools (or any other combination) -->
<script src="http://cdn.jquerytools.org/1.2.4/form/jquery.tools.min.js"></script>

<!-- dateinput styling -->
<link rel="stylesheet" type="text/css" href="dateinput.css"/>

<!-- HTML5 date input -->
<input type="date" />

<!-- make it happen -->
<script>
$(":date").dateinput();</script>

See Demo  : & Download File From : http://flowplayer.org/tools/demos/dateinput/ 

Javascript For Circling text

<script type="text/javascript">


;(function(){


var msg = "www.dotnetspider.com";




var size = 24;


var circleY = 0.75; var circleX = 2;


var letter_spacing = 5;


var diameter = 10;


var rotation = 0.4;

var speed = 0.3;



if (!window.addEventListener && !window.attachEvent || !document.createElement) return;

msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},

makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},

drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},

init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},

ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};

o.id = 'outerCircleText'; o.style.fontSize = size + 'px';

if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};

})();

</script>

improving image quality

As you can see, the image is smaller again, but the quality has improved. First I have to remove part of the coding which makes that icon and link to Picasa. In order to change the image size, this time I don't have the width and height parameters showing in the code. Yeah. But what I can do is turn the s400 number, which does show in there, into s800.

So from this:

<div style='text-align:center;margin:0px auto 10px;'><a href='http://1.bp.blogspot.com/_kwcZ6o5jNCw/SqY2LNT8H9I/AAAAAAAAEjQ/2VsHtsfcuiY/s1600-h/indian+child-1.jpg'><img src='http://1.bp.blogspot.com/_kwcZ6o5jNCw/SqY2LNT8H9I/AAAAAAAAEjQ/2VsHtsfcuiY/s400/indian+child-1.jpg' border='0' alt='' /></a> </div><div style='clear:both; text-align:CENTER'><a href='http://picasa.google.com/blogger/' target='ext'><img src='http://photos1.blogger.com/pbp.gif' alt='Posted by Picasa' style='border: 0px none ; padding: 0px; background: transparent none repeat scroll 0% 50%; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial;' align='middle' border='0' /></a></div>

We change to this:

<div style='text-align:center;margin:0px auto 10px;'><a href='http://1.bp.blogspot.com/_kwcZ6o5jNCw/SqY2LNT8H9I/AAAAAAAAEjQ/2VsHtsfcuiY/s1600-h/indian+child-1.jpg'><img src='http://1.bp.blogspot.com/_kwcZ6o5jNCw/SqY2LNT8H9I/AAAAAAAAEjQ/2VsHtsfcuiY/s800/indian+child-1.jpg' border='0' alt='' /></a> </div><div style='clear:both; text-align:CENTER'></div>

Validate Email ID

function IsEmailValid(string)
{
    if(!IsNull(string))
    {
     var regex = new RegExp('^[\\w-_%\.]*[\\w-_%\.]\@[\\w]\

.+[\\w]+[\\w]$');
        return regex.test(string);
    }
    
    return false;
}

function IsNull(val)
{
    return (val == null || val == '');
}

Date Comparer in Javascript

This code is used to comapre date and sort dates.

function DateComparer(firstValue, SecondValue)
{
    var sortFirstRow  = GetFormattedDateForSort(firstValue);
    var sortSecondRow = GetFormattedDateForSort(SecondValue);
    
    if(sortFirstRow == sortSecondRow) return 0;
    if(sortFirstRow >  sortSecondRow) return 1;
    if(sortFirstRow <  sortSecondRow) return -1;
}
function GetFormattedDateForSort(value)
{
   var retValue = "";
   if(value != "")
   {
        var month   = value.split('/')[0];
        var day     = value.split('/')[1];
        var year    = value.split('/')[2];
        
        if(month != undefined)
        {
            if(month.length == 1 && month < 10)
            {
                month = '0' + month;
            }
        }
        if(day != undefined)
        {
            if(day.length == 1 && day < 10)
            {
                day = '0' + day;
            }
        }
        
        retValue = year + month + day ;
    }
    return retValue;
}