Passing a Session Dynamically in RowDataBound

November 21, 2007

protected void GridView_RowDataBound(object sender, GridViewRowEventArgs e)
    {

        if (e.Row.RowType == DataControlRowType.DataRow)
        {

            e.Row.Attributes["onmouseover"] = “this.style.color=’DodgerBlue’;this.style.cursor=’hand’;”;
            e.Row.Attributes["onmouseout"] = “this.style.color=’MidnightBlue’;”;

            e.Row.Attributes["onclick"] = “window.navigate(‘details.aspx?id=” + e.Row.DataItemIndex.ToString() + “‘)”;

            string myString = Convert.ToString(DataBinder.Eval(e.Row.DataItem, “Comments”));
            string mystringid = “mySession” + e.Row.DataItemIndex.ToString();
            Session[mystringid] = myString;

       
        }

    }  The details page:

protected void Page_Load(object sender, EventArgs e){

string mystringid = “mySession” + Request.QueryString["id"].ToString();Label1.Text = Session[mystringid].ToString();

}


Making a Span Invisible by Animation

November 20, 2007

Hi guys,

A snippet on making a span invisible with fading effect. 

<html xmlns=”http://www.w3.org/1999/xhtml” ><head > <title>Making Div Opaque</title><script type=”text/javascript” >var firstClick = true;function opacity(myID) {

if(firstClick){var millisec = 500;//speed for each frame var speed = Math.round(millisec / 100); var timer = 0; for(var i = 100; i >= 0; i–) {setTimeout(

“changeOpac(“ + i + “,’” + myID + “‘)”,(timer * speed)); timer++;if(i==0){firstClick = false;}}}

}

//change the opacity for different browsersfunction changeOpac(myopacity, theID){var object = document.getElementById(theID).style; object.opacity = (myopacity / 100);object.MozOpacity = (myopacity / 100);object.KhtmlOpacity = (myopacity / 100);

object.filter = “alpha(style=1, opacity=” + myopacity + “)”; }</script>

</head><body><form id=”form1″><div><table>

<tr><td><div style=”width:300px; height:30px; background-color:#FF0000;font-family:impact; font-size:18pt; filter:alpha(style=1, opacity=100); -moz-opacity:90″ id=”divUsers”>Fade This Text</div>

</td></tr><tr><td>

<a href=”javascript:opacity(‘divUsers’)”>Hide</a> </td></tr></table> </div></form></body></html>


Making a GridView Row a HyperLink

November 19, 2007

protected void companies_RowDataBound(object sender, GridViewRowEventArgs e){

if (e.Row.RowType == DataControlRowType.DataRow){

e.Row.Attributes["onmouseover"] = “this.style.color=’DodgerBlue’;this.style.cursor=’hand’;”;e.Row.Attributes["onmouseout"] = “this.style.color=’MidnightBlue’;”;

Label lblID = e.Row.FindControl(“lblUserID”) as Label;Session["MySession"] = ((Label)e.Row.FindControl(“lblUserID”)).Text;e.Row.Attributes[

"onclick"] = “window.navigate(‘NavigatedPage.aspx?id=” + lblID.Text + “‘)”;}

}


Paging in JS

November 16, 2007

var count_of_members;
var members;
var members_array;
var page_size;
var myDivContent;
var current_page = 1;
var start_index = 0;
var end_index;
var no_of_pages;
var loadType = “”;
var blnIsClicked = false;
var myTimer = 0;
var tempLoadType = “”;

function CustomPaging()
{
count_of_members = document.getElementById(“Count”).value – 0;
members = document.getElementById(“Members”).value;
page_size = document.getElementById(“PageSize”).value – 0;
no_of_pages = Math.ceil(count_of_members/page_size);
members_array = members.split(“|”);
end_index = ( count_of_members < page_size ) ? count_of_members : page_size;
ChangePage(loadType);
document.getElementById(“divListings”).innerHTML = myDivContent;
if(no_of_pages!=1 )
{
myTimer = setTimeout(CustomPaging,3000);
if(!blnIsClicked)
loadType =”btnNext”;
}
}

function ChangePage(elm)
{
if(elm == “btnPrev”)
{
current_page = ( current_page != 1 )? current_page – 1 : no_of_pages;
loadType =”btnPrev”;blnIsClicked = true;
}
if(elm == “btnNext”)
{
current_page = ( current_page != no_of_pages )? current_page + 1 : 1;
loadType = “btnNext”;blnIsClicked = true;
}
start_index = (current_page – 1) * page_size;
end_index = (current_page * page_size > count_of_members)? count_of_members : current_page * page_size;
PopulateDIV();
document.getElementById(“divListings”).innerHTML = myDivContent;
tempLoadType = “” ? “btnNext”:loadType;
}

function PopulateDIV()
{
myDivContent = “<table border=’1′><tr><td>”;
myDivContent += “<table onmouseover = ‘StopPaging();’ onmouseout = ‘ResumePaging();’>”;
for(var i = start_index; i < end_index; i++)
{
myDivContent +=”<tr>”;
myDivContent += “<td colspan=’3′ align=’left’>”;
myDivContent += “<a href=’” + members_array[i] + “‘>” + members_array[i] + “</a>”;
myDivContent += “</td></tr>”;
}
myDivContent += “</table></td></tr>”;
if(no_of_pages != 1)
{
myDivContent += “<tr><td>”;
myDivContent += “<table><tr><td>”;
myDivContent += “<a id=’btnPrev’ onclick=’ChangePage(this.id);’ style=’cursor:hand’><<Previous</a></div></td>”;
myDivContent += “<td> Page “+ current_page +” of “+ no_of_pages +” Pages.</td>”;
myDivContent += “<td>”;
myDivContent += “<a id=’btnNext’ onclick=’ChangePage(this.id);’ style=’cursor:hand’>Next>></a></div></td>”;
myDivContent += “</tr ></table></td></tr>”;}
myDivContent += “</table>”;
}
}

function StopPaging()
{
clearTimeout(myTimer);
}

function ResumePaging()
{
if(no_of_pages!=1 )
{
myTimer = setTimeout(CustomPaging,3000);
loadType = tempLoadType;
}
}


Div Over Div in JavaScript

October 17, 2007

<!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>
<title> Test</title>
<style type=”text/css”>
.opaqueLayer
{
display:none;
position:absolute;
top:0px;
left:0px;
opacity:0.6;
filter:alpha(opacity=60);
background-color: #000000;
z-Index:1000;
}

.questionLayer
{
position:absolute;
top:0px;
left:0px;
width:350px;
height:200px;
display:none;
z-Index:1001;
border:2px solid black;
background-color:#FFFFFF;
text-align:center;
vertical-align:middle;
padding:10px;
}
</style>
<script type=”text/javascript”>
function getBrowserHeight() {
var intH = 0;
var intW = 0;

if(typeof window.innerWidth == ‘number’ ) {
intH = window.innerHeight;
intW = window.innerWidth;
}
else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
intH = document.documentElement.clientHeight;
intW = document.documentElement.clientWidth;
}
else if(document.body && (document.body.clientWidth || document.body.clientHeight)) {
intH = document.body.clientHeight;
intW = document.body.clientWidth;
}
return { width: parseInt(intW), height: parseInt(intH) };
}

function setLayerPosition() {
var shadow = document.getElementById(’shadow’);
var question = document.getElementById(‘question’);

var bws = getBrowserHeight();
shadow.style.width = bws.width + ‘px’;
shadow.style.height = bws.height + ‘px’;
question.style.left = parseInt((bws.width – 350) / 2)+ ‘px’;
question.style.top = parseInt((bws.height – 200) / 2)+ ‘px’;
shadow = null;
question = null;
}

function showLayer() {
setLayerPosition();

var shadow = document.getElementById(’shadow’);
var question = document.getElementById(‘question’);

shadow.style.display = ‘block’;
question.style.display = ‘block’;

shadow = null;
question = null;
}

function hideLayer() {
var shadow = document.getElementById(’shadow’);
var question = document.getElementById(‘question’);

shadow.style.display = ‘none’;
question.style.display = ‘none’;

shadow = null;
question = null;
}

window.onresize = setLayerPosition;
</script>
</head>
<body>
<div id=”shadow” class=”opaqueLayer”> </div>
<div id=”question” class=”questionLayer”>
<br />
<br />
<br />
We can put anything in here
<br />
<br />
<br />
<input type=”button” onclick=”hideLayer();” value=”Close” />
</div>
<h3>Modal Layer Test</h3>
<p>Click the image below to display the “modal” layer</p>
<img src=”http://www.google.co.in/intl/en_ALL/images/logo.gif” alt=”Test Image” onclick=”showLayer();” />
</body>
</html>