Tuesday, October 4, 2011

Javascript Tricks (No Interview Questions)




1        How to get client date and time

Ans-        How to get client date and time
You can use java script function to show the date and time.
<script type="text/javascript">
function displayTime()
{
var localTime = new Date();
var year= localTime.getYear();
var month= localTime.getMonth() +1;
var date = localTime.getDate();
var hours = localTime .getHours();
var minutes = localTime .getMinutes();
var seconds = localTime .getSeconds();
var div=document.getElementById("div1");
div.innerText=year+"-"+month+"-"+date+" "+hours+":"+minutes+":"+seconds;
}

</script>

Then you can call it at web page.

<body onload="displayTime();">
<form id="form2" runat="server">
<div id="div1"></div>
</form>
</body>

Related posts: http://forums.asp.net/p/1247758/2303034.aspx



2        How to access a control by using JavaScript

Ans-  2        How to access a control by using JavaScript
Reference the ClientID property (or UniqueID) of the control in the JavaScript.
protected void Page_Load(object sender, EventArgs e)
{
Button btn= new Button();
btn.ID = "btn5";
btn.Attributes.Add("runat", "server");
btn.Attributes.Add("onclick", "pop('" + btn.ClientID + "')");
btn.Text = "Test";
this.form1.Controls.Add(btn);
}

function pop(InputBoxID)
{
var InputControl = document.getElementById(InputBoxID);
alert(InputControl.value);
}
Or you can use the following method:
btn.Attributes.Add("onclick", "pop(this)");
function pop(InputBox)
{
alert(InputBox.value);
}

Related posts: http://forums.asp.net/p/1239593/2260331.aspx#2260331


3        How to invoke a server-side function with JavaScript

Ans- 3        How to invoke a server-side function with JavaScript

Firstly, you can drag a server button and put the server function into the button Click even,
protected void Button1_Click(object sender, EventArgs e)
{
FunctionName();
}
Secondly, you can call the server function at JavaScript by using the following code,
document.getElementById("Button1").click();

Related posts: http://forums.asp.net/p/1242420/2274228.aspx


4        How to retrieve server side variables using JavaScript code

Ans-  4       How to retrieve server side variables using JavaScript code [top]

<asp:HiddenField ID="HiddenField1" runat="server" />
public partial class LoginDemo : System.Web.UI.Page
{
private string str="hello";
protected void Page_Load(object sender, EventArgs e)
{
HiddenField1.Value=str;
}
}

Then you can access the control HiddenField1 using javascipt:
<script type="text/JavaScript">
Var tt=document.getElementByID(“HiddenField1”);
alert(tt.value);
</script>

Related posts: http://forums.asp.net/p/1000655/1319119.aspx


5        How to assign a value to a hidden field using JavaScript in ASP.NET

Ans-  5        How to assign a value to a hidden field using JavaScript in ASP.NET

We can use JavaScript to set the value of a hidden control and get its value at the server after a
<input id="Hidden1" type="hidden" />
<script type="text/JavaScript">
var str=”hello”
document.getElementByID(“Hidden1”).value=str
</script>
protected void Page_Load(object sender, EventArgs e)
{
string str=request["Hidden1"].ToString();
}

Related posts: http://forums.asp.net/p/1262153/2362090.aspx


6        How to register the JavaScript function at Code-Behind

Ans-   6        How to register the JavaScript function at Code-Behind
Use ResterStartupScript
this.Page.ClientScript.RegisterStartupScript(this.GetType(),"alert","<script>aler

Use Literal control,
private void Button2_Click(object sender, System.EventArgs e)
{
string str;
str="<script language='JavaScript'>";
str+="selectRange()";
str+="<script>";
Literal1.Text=str;
}

Related posts: http://forums.asp.net/p/981603/1257057.aspx#1257057


7        How to display images with a delay of five seconds

Ans-   7        How to display images with a delay of five seconds [top]

With this script you can see clickable images rotating in real-time without requiring banner rotat
reloads/refreshes .You should see a new banner rotating every 5 seconds:

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org
transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>JavaScript</title>
<script language="javascript" type="text/javascript">
var image="";
var banners=0;
function loadbanners() {
if (banners==1)
{
image="images/AJAX.gif";
}
if (banners==2)
{
image="images/ASPDotNet.gif";
}
if (banners==3)
{
image=" images/MSDN.gif";
}
}
function cycle()
{
if (++banners > 3)
banners=1;
loadbanners();
document.getElementById("banner1").src =image;
window.setTimeout('cycle();',5000);
}
</script>
</head>
<body onload="cycle();">
<form id="form2" runat="server">
<div>
<img alt="" id="banner1" src="images/start.png" />
</div>
</form>
</body>
</html>

Related posts:

http://forums.asp.net/p/1213103/2147140.aspx


8        How to get browser screen settings and apply it to page controls
Ans-   8

How to get browser screen settings and apply it to page controls [top]

You can use the JavaScript, suppose the control type is <image>, see the code below:
<html>
<body>
<input onclick="resizeImage()"/>
<img src="http://www.microsoft.com/library/toolbar/3.0/images/banners/ms_masthead
>
<script language="JavaScript">
var winWidth = 0;
var winHeight = 0;
function resizeImage(){
var img=document.getElementById("testImage")
if (window.innerWidth)
winWidth = window.innerWidth;
else if ((document.body) && (document.body.clientWidth))
winWidth = document.body.clientWidth;
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
if (document.documentElement && document.documentElement.clientHeight &&
document.documentElement.clientWidth)
{
winHeight = document.documentElement.clientHeight;
winWidth = document.documentElement.clientWidth;
}
img.width= winHeight;
img.width= winWidth;
}
</script>
</body>
</html>

Please remove the control style if it is present.

Related posts:http://forums.asp.net/p/1228180/2212987.aspx


9        How to clear the session when the user closes a window

Ans-  9        How to clear the session when the user closes a window [top]

Use the code,
<script type="text/javascript">
function window.onbeforeunload()
{
var xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();

}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
alert("Your browser does not support AJAX!");
return false;
}
}
if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)
{
xmlhttp.open("GET","exit.aspx",false);
xmlhttp.send();
}

}
</script>

Related posts: http://forums.asp.net/p/1237752/2255401.aspx


These are some tricks which have to use a fresher web gardener (developer)

1 comment: