Friday, March 14, 2008

how show a div depends on condtions

step 1) create a update panel and fix div like as shown below


[
aja:UpdatePanel ID="UpdatePanelMailpeview" runat="server"]

[ContentTemplate]

[div style="position: absolute; display: none; background-color: #F3F3F3;" id="divEmailPreview"

runat="server"]

[table width="350" border="0" cellspacing="0" cellpadding="0"]

[tr]

[td style="width: 4px;"]

[img src="images/grey_box_big_tleft.gif" width="4" height="27" alt="" /]

[/td]

[td style="background-image: url(images/grey_box_big_tmiddle.gif); background-repeat: repeat-x;" class="heading_white1"]

Mail Preview

[/td]

[td style="width: 4px;"]

[img src="images/grey_box_big_tright.gif" width="4" height="27" alt="" /][/td]

[/tr]

[tr]

[td style="background-image: url(images/grey_box_big_mleft.gif); background-repeat: repeat-y;

width: 4px;"]

[/td]

[td]

[table width="94%" style="height: 187px;" border="0" align="center" cellpadding="0"

cellspacing="0"]

[tr]

[td valign="top"]

[table cellpadding="0" cellspacing="0" border="0" width="98%"]

[tr]

[td]

[asp:Literal ID="ltlMailPreview" runat="server"][/asp:Literal]

[/td]

[/tr]

[tr]

[td style="height: 10px;" align="center"]

[/td]

[/tr]

[tr]

[td align="center" valign="middle"]

[table]

[tr]

[td valign="middle"]

[asp:ImageButton ID="imgbtnSendmails" ImageUrl="~/images/send_btn1.gif" runat="server"

OnClick="imgbtnSendmails_Click" OnClientClick="return setPossitionUpdateProgress('200','400');"/]

[/td]

[td valign="middle"]

[asp:ImageButton ImageUrl="~/images/cancel_btn.gif" OnClientClick=" return DivMailClose();"

ID="ImageButton5" runat="server" /][/td]

[/tr]

[/table]

[/td]

[/tr]

[/table]

[/td]

[/tr]

[/table]

[/td]

[td style="background-image: url(images/grey_box_big_mright.gif); background-repeat: repeat-y;

width: 4px;"]

[/td]

[/tr]

[tr]

[td valign="top"]

[img src="images/grey_box_big_bleft.gif" width="4" height="4" alt="" /][/td]

[td valign="top" style="background-image: url(images/grey_box_big_bmiddle.gif); background-repeat: repeat-x;"]

[/td]

[td valign="top"]

[img src="images/grey_box_big_bright.gif" width="4" height="4" alt="" /][/td]

[/tr]

[/table]

[/div]

[/ContentTemplate]

[/aja:UpdatePanel]

step 2) now some woke with javaScript

[script language="javascript" type="text/javascript"]

function DivMailClose()

{

var a;

if(document.getElementById("[%=divEmailPreview.ClientID%]").style.display =='block')

{

document.getElementById("[%=divEmailPreview.ClientID%]").style.display='none';

document.getElementById("[%=divEmailPreview.ClientID%]").style.visibility='hidden';

}

a = HideMsgDivDetails2();

return a;

}

function DivShowMail()

{

var divEmailPreviewMain = document.getElementById("[%=divEmailPreview.ClientID%]");

divEmailPreviewMain.style.display='block';

divEmailPreviewMain.style.visibility='visible';

divEmailPreviewMain.style.position="absolute";

divEmailPreviewMain.style.top = '100px';

divEmailPreviewMain.style.left= '220px'

/* if (e == null) e = event;

divEmailPreviewMain.style.top = (e.clientY+15)+'px';

divEmailPreviewMain.style.left = (e.clientX+15)+'px';*/

return false;

}

[/script]

step 3) now come on code behind

if (true)

{

this.ltlMailPreview.Text = “Text which we wana show”;

fromAddressBook = true;

string strMailPreview = "";

System.Web.UI.ScriptManager.RegisterStartupScript(UpdatePanelMailpeview, this.GetType(), "mailPreview", strMailPreview, false);

}

Mahesh K. Sharma
Email me
mahesh.sharma@live.in

No comments: