Showing posts with label web development. Show all posts
Showing posts with label web development. Show all posts
Saturday, July 16, 2011
Free floating social bookmarking buttons
Labels:
blog,
bookmarking,
button,
floating,
free,
HTML,
social,
web development,
website,
widget
Saturday, January 29, 2011
How to make a traceable website in ASP.NET
If we want to make a traceable website in ASP.NET, so that we can trace the record of our own ASP.NET website. To make a webpage traceable set trace property to true in HTML source page directory of the webpage document.
To make large number of pages traceable, follow the given steps:
- Open web.config file.
- In <System.web>, write the following.
- <trace enabled="true" localOnly="true" mostRecent="true" pageOutput="true" requestLimit="25"/>
~/your site/trace.axd
or to check the intermediate values of any event, write following code in your code view of the page.
int a=50;
Trace.Warn(a.ToString());
Trace.Write(a.ToString());
I have tried it and it has worked, i hope it worked for you too.
Labels:
asp.net,
how to,
trace,
web development,
webpage
Thursday, January 20, 2011
To create an File upload Form using html
To make users to upload files can be very useful. Here is an HTML form for uploading files:
<html>
<body>
<form action="upload_file.php" method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file" />
<br />
<input type="submit" name="submit" value="Submit" />
</form>
</body>
</html>
Here the enctype attribute of the <form> tag specifies which content-type to use when submitting the form.
The type="file" attribute of the <input> tag specifies that the input is processed in form of a file.
Labels:
file upload,
HTML,
web development
Tuesday, January 18, 2011
To obtain your browser information using javascript
Browser information using javascript's navigator object
If it is needed to detect the visitor's browser, and the appropriate information can be obtained using navigator objects of javascript.
The best method to do this is to make your web pages smart enough to look one type to some browsers and another type to other browsers.
The Navigator object contains information about the visitor's browser name, version, cookies enabled, browser code name etc.
//////////////////////////////
here is the code for detecting various types of browser information.
//////////////////////////////
<html>
<head>
<title>
Browser information
</title>
</head>
<body>
<script type="text/javascript">
document.write("<br /><br />");
document.write("CodeName of the Browser : " + navigator.appCodeName);
document.write("<br /><br />");
document.write("Name of the Browser: " + navigator.appName);
document.write("<br /><br />");
document.write("User-agent's header information: " + navigator.userAgent);
document.write("<br /><br />");
document.write("Browser Version: " + navigator.appVersion);
document.write("<br /><br />");
document.write("Platform name: " + navigator.platform);
document.write("<br /><br />");
document.write("Are Cookies Enabled?: " + navigator.cookieEnabled);
</script>
</body>
</html>
If it is needed to detect the visitor's browser, and the appropriate information can be obtained using navigator objects of javascript.
The best method to do this is to make your web pages smart enough to look one type to some browsers and another type to other browsers.
The Navigator object contains information about the visitor's browser name, version, cookies enabled, browser code name etc.
//////////////////////////////
here is the code for detecting various types of browser information.
//////////////////////////////
<html>
<head>
<title>
Browser information
</title>
</head>
<body>
<script type="text/javascript">
document.write("<br /><br />");
document.write("CodeName of the Browser : " + navigator.appCodeName);
document.write("<br /><br />");
document.write("Name of the Browser: " + navigator.appName);
document.write("<br /><br />");
document.write("User-agent's header information: " + navigator.userAgent);
document.write("<br /><br />");
document.write("Browser Version: " + navigator.appVersion);
document.write("<br /><br />");
document.write("Platform name: " + navigator.platform);
document.write("<br /><br />");
document.write("Are Cookies Enabled?: " + navigator.cookieEnabled);
</script>
</body>
</html>
This code will help you in gaining some of information about the browser you are using.
Labels:
browser,
how to,
javascript,
web development
Saturday, January 15, 2011
Reading XML files in ASP.NET
Reading XML Files
The following are ways to read and navigate the content of an XML file:
Using XmlDocument: You can load the document using the XmlDocument class mentioned
earlier. This holds all the XML data in memory once you call Load() to retrieve it from a file or
stream. It also allows you to modify that data and save it back to the file later. The XmlDocument
class implements the full XML DOM.
Using XPathNavigator: You can load the document into an XPathNavigator (which is located
in the System.Xml.XPath namespace). Like the XmlDocument, the XPathNavigator holds the
entire XML document in memory. However, it offers a slightly faster, more streamlined model
than the XML DOM, along with enhanced searching features. Unlike the XmlDocument, it
doesn’t provide the ability to make changes and save them.
Using XmlTextReader: You can read the document one node at a time using the XmlTextReader
class. This is the least expensive approach in terms of server resources, but it forces you to examine the data sequentially from start to finish.
The following sections demonstrate each of these approaches to loading the VIDEO list XML document.
Using the XML DOM
The XmlDocument stores information as a tree of nodes. A node is the basic ingredient of an
XML file and can be an element, an attribute, a comment, or a value in an element. A separate
XmlNode object represents each node, and nodes are grouped together in collections.
You can retrieve the first level of nodes through the XmlDocument.ChildNodes property. In this
example, that property provides access to the <VideoList> element. The <VideoList> element contains
other child nodes, and these nodes contain still more nodes and the actual values. To drill down
through all the layers of the tree, you need to use recursive logic, as shown in this example.
When the example page loads, it creates an XmlDocument object and calls the Load() method,
which retrieves the XML data from the file. It then calls a recursive function in the page class named
GetChildNodesDescr(). GetChildNodesDescr() takes an XmlNodeList object as an input and the
index of the nesting level. It then returns the string with the content for that node and all its child
nodes and attributes.
private void Page_Load(object sender, System.EventArgs e)
{
string xmlFile = Server.MapPath("VideoList.xml");
// Load the XML file in an XmlDocument.
XmlDocument doc = new XmlDocument();
doc.Load(xmlFile);
// Write the description text.
XmlText.Text = GetChildNodesDescr(doc.ChildNodes, 0);
}
When the Page.Load event handler calls GetChildNodesDescr(), it passes an XmlNodeList
object that represents the first level of nodes. (The XmlNodeList contains a collection of XmlNode
objects, one for each node.) The code also passes 0 as the second argument of GetChildNodes-
Descr() to indicate that this is the first level of the structure. The string returned by the GetChild-
NodesDescr() method is then shown on the page using a Literal control.
The interesting part is the GetChildNodesDescr() method. It first creates a string with three
spaces for each indentation level that it will later use as a prefix for each line added to the final
HTML text.
private string GetChildNodesDescr(XmlNodeList nodeList, int level)
{
string indent = "";
for (int i=0; i<level; i++)
indent += " ";
...
Next, the GetChildNodesDescr() method cycles through all the child nodes of the XmlNodeList.
For the first call, these nodes include the XML declaration, the comment, and the <VideoList> element.
An XmlNode object exposes properties such as NodeType, which identifies the type of item
(for example, Comment, Element, Attribute, CDATA, Text, EndElement, Name, and Value). The code
checks for node types that are relevant in this example and adds that information to the string, as
shown here:
...
StringBuilder str = new StringBuilder("");
foreach (XmlNode node in nodeList)
{
switch(node.NodeType)
{
case XmlNodeType.XmlDeclaration:
str.Append("XML Declaration: <b>");
str.Append(node.Name);
str.Append(" ");
str.Append(node.Value);
str.Append("</b><br />");
break;
case XmlNodeType.Element:
str.Append(indent);
str.Append("Element: <b>");
str.Append(node.Name);
str.Append("</b><br />");
break;
case XmlNodeType.Text:
str.Append(indent);
str.Append(" - Value: <b>");
str.Append(node.Value);
str.Append("</b><br />");
break;
case XmlNodeType.Comment:
str.Append(indent);
str.Append("Comment: <b>");
str.Append(node.Value);
str.Append("</b><br />");
break;
}
...
Note that not all types of nodes have a name or a value. For example, for an element such as
Title, the name is Title, but the value is empty, because it’s stored in the following Text node.
Next, the code checks whether the current node has any attributes (by testing if its Attributes
collection is null). If it does, the attributes are processed with a nested foreach loop:
...
if (node.Attributes != null)
{
foreach (XmlAttribute attrib in node.Attributes)
{
str.Append(indent);
str.Append(" - Attribute: <b>");
str.Append(attrib.Name);
str.Append("</b> Value: <b>");
str.Append(attrib.Value);
str.Append("</b><br />");
}
}
...
Lastly, if the node has child nodes (according to its HasChildNodes property), the code recursively
calls the GetChildNodesDescr function, passing to it the current node’s ChildNodes collection
and the current indent level plus 1, as shown here:
...
if (node.HasChildNodes)
str.Append(GetChildNodesDescr(node.ChildNodes, level+1));
}
return str.ToString();
}
When the whole process is finished, the outer foreach block is closed, and the function returns
the content of the StringBuilder object.
Labels:
asp.net,
reading,
web development,
xml
Monday, January 10, 2011
First Basic AJAX code for beginners
AJAX is asynchronous javascript and xml, and is most widely used technology to give dynamic content to other web development technologies like ASP.NET and PHP.
AJAX is a technique for creating fast and dynamic web pages.
AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.Classic web pages, (which do not use AJAX) must reload the entire page if the content should change.
Examples of applications using AJAX : Google Maps, Gmail, Youtube, and Facebook tabs. AJAX is based on internet standards, and uses a combination of:
1) XMLHttpRequest object (to exchange data asynchronously with a server)
2) JavaScript/DOM (to display/interact with the information)
3) CSS (to style the data)
4) XML (often used as the format for transferring data)
2) JavaScript/DOM (to display/interact with the information)
3) CSS (to style the data)
4) XML (often used as the format for transferring data)
AJAX applications are browser- and platform-independent!
Here is the first code:
/////////////////////
In design view enter the following code
/////////////////////
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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 runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server">name</asp:Label>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<br />
<asp:Label ID="Label2" runat="server"></asp:Label>
<br />
<br />
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl="~/ajax-loader (1).gif" />
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
///////////////////////
In code view enter the following:
//////////////////////
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
Label2.Text = "hello " + TextBox1.Text;
System.Threading.Thread.Sleep(5000);
}
}
///////////////////////////////////////
In this method whenever the user fills the textbox and then clicks the command button, the animated image ajax-loader(1).gif will appear for 5 seconds before being vanished and then the value of textbox in the preceding label.
Labels:
AJAX,
asp.net,
dynamic,
how to,
web development
Sunday, January 9, 2011
Creating a Dynamic left menu on a web page
A left menu acts like an sitemap, onmouseover action i.e whenever we hover a mouse on left menu a subdirectory will pop up for each main directory.
This can be quiet helpful in giving a better or more attractive look to your web page than with a site map.
You just create a leftmenu.ascx file drag it from solution explorer of visual studio to the desired location on your web page.
///////////////////
Here is the design code for the leftmenu.ascx file:
///////////////////
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="leftMenu.ascx.cs" Inherits="leftMenu" %>
<script language="javascript" type="text/javascript">
function fun1()
{
d1.style.visibility='visible';
}
function fun2()
{
d1.style.visibility='hidden';
}
function fun3()
{
d2.style.visibility='visible';
}
function fun4()
{
d2.style.visibility='hidden';
}
function fun5()
{
d3.style.visibility='visible';
}
function fun6()
{
d3.style.visibility='hidden';
}
function fun7()
{
d4.style.visibility='visible';
}
function fun8()
{
d4.style.visibility='hidden';
}
</script>
<body>
<div style="Z-INDEX: 101; LEFT: 20px; WIDTH: 101px; POSITION: absolute; TOP: 80px; HEIGHT: 80px" >
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun1();this.style.background='orange'"
onmouseout="fun2();this.style.background='yellow'">ABCD 1<font color="yellow">------></font></a><br />
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun3();this.style.background='orange'"
onmouseout="fun4();this.style.background='yellow'">ABCD 2<font color="yellow">------></font></a><br />
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun5();this.style.background='orange'"
onmouseout="fun6();this.style.background='yellow'">ABCD 3<font color="yellow">------></font></a><br />
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun7();this.style.background='orange'"
onmouseout="fun8();this.style.background='yellow'">ABCD 4<font color="yellow">------></font></a>
</div>
<div id="d1" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:80px;HEIGHT:48px"
onmouseover="fun1()" onmouseout="fun2()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none"
onmouseout="this.style.background='yellow'" href="default2.aspx">ABCD 11</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="WebForm1.aspx">ABCD 12</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 13</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 14</a>
</div>
<div id="d2" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:100px;HEIGHT:48px"
onmouseover="fun3()" onmouseout="fun4()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 21</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 22</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 23</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 24</a>
</div>
<div id="d3" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:120px;HEIGHT:48px"
onmouseover="fun5()" onmouseout="fun6()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 31</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 32</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 33</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 34</a>
</div>
<div id="d4" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:140px;HEIGHT:48px"
onmouseover="fun7()" onmouseout="fun8()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 41</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 42</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 43</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 44</a>
</div>
</body>
This can be quiet helpful in giving a better or more attractive look to your web page than with a site map.
You just create a leftmenu.ascx file drag it from solution explorer of visual studio to the desired location on your web page.
///////////////////
Here is the design code for the leftmenu.ascx file:
///////////////////
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="leftMenu.ascx.cs" Inherits="leftMenu" %>
<script language="javascript" type="text/javascript">
function fun1()
{
d1.style.visibility='visible';
}
function fun2()
{
d1.style.visibility='hidden';
}
function fun3()
{
d2.style.visibility='visible';
}
function fun4()
{
d2.style.visibility='hidden';
}
function fun5()
{
d3.style.visibility='visible';
}
function fun6()
{
d3.style.visibility='hidden';
}
function fun7()
{
d4.style.visibility='visible';
}
function fun8()
{
d4.style.visibility='hidden';
}
</script>
<body>
<div style="Z-INDEX: 101; LEFT: 20px; WIDTH: 101px; POSITION: absolute; TOP: 80px; HEIGHT: 80px" >
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun1();this.style.background='orange'"
onmouseout="fun2();this.style.background='yellow'">ABCD 1<font color="yellow">------></font></a><br />
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun3();this.style.background='orange'"
onmouseout="fun4();this.style.background='yellow'">ABCD 2<font color="yellow">------></font></a><br />
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun5();this.style.background='orange'"
onmouseout="fun6();this.style.background='yellow'">ABCD 3<font color="yellow">------></font></a><br />
<a href="" style="BACKGROUND:yellow;WIDTH:100px;HEIGHT:20px;TEXT-DECORATION:none" onmouseover="fun7();this.style.background='orange'"
onmouseout="fun8();this.style.background='yellow'">ABCD 4<font color="yellow">------></font></a>
</div>
<div id="d1" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:80px;HEIGHT:48px"
onmouseover="fun1()" onmouseout="fun2()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none"
onmouseout="this.style.background='yellow'" href="default2.aspx">ABCD 11</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="WebForm1.aspx">ABCD 12</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 13</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 14</a>
</div>
<div id="d2" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:100px;HEIGHT:48px"
onmouseover="fun3()" onmouseout="fun4()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 21</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 22</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 23</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 24</a>
</div>
<div id="d3" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:120px;HEIGHT:48px"
onmouseover="fun5()" onmouseout="fun6()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 31</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 32</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 33</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 34</a>
</div>
<div id="d4" style="Z-INDEX:101;LEFT:120px;VISIBILITY:hidden;WIDTH:101px;POSITION:absolute;TOP:140px;HEIGHT:48px"
onmouseover="fun7()" onmouseout="fun8()">
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 41</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 42</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 43</a><br />
<a onmouseover="this.style.background='orange'" style="BACKGROUND: yellow; WIDTH: 100px; HEIGHT: 20px; TEXT-DECORATION: none" onmouseout="this.style.background='yellow'" href="">ABCD 44</a>
</div>
</body>
Friday, January 7, 2011
Stopwatch in javascript
we an easily make a stopwatch in javascript. I have used two functions in making of javascript stopwatch by use of two functions namely timedCount() and stopCount() as they have been described in the code below.
we can make both incrementing and decrementing stop watch in javascript using the code below by making very few changes. we can change the starting value by making changes in variable c value accordingly.
///////////////////////////////////
Here is the code for incrementing:
//////////////////////////////////
<html>
<head>
<title>stopwatch</title>
</head>
<script type="text/javascript">
var c=0
var t
function stopCount()
{
clearTimeout(t)
}
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
if(c==61)
{
alert("time over")
stopcount()
}
t=setTimeout("timedCount()",1000)
}
</script>
<body>
<center>
<form>
<input type="text" id="txt">
<input type="button" value="Start stopwatch" onClick="timedCount()">
<p>Click on the Start button above to start the stopwatch.</p>
</form>
<center>
</body>
</html>
////////////////////////////////////
And here is the code for decrementing stopwatch:
////////////////////////////////////
<html>
<head>
<title>stopwatch</title>
</head>
<script type="text/javascript">
var c=60
var t
function stopCount()
{
clearTimeout(t)
}
function timedCount()
{
document.getElementById('txt').value=c
c=c-1
if(c==-1)
{
alert("time over")
stopcount()
}
t=setTimeout("timedCount()",1000)
}
</script>
<body>
<center>
<form>
<input type="text" id="txt">
<input type="button" value="Start stopwatch" onClick="timedCount()">
<p>Click on the Start button above to start the stopwatch.</p>
</form>
<center>
</body>
</html>
please give comments and advices even if you liked it or not.
Labels:
how to,
javascript,
stopwatch,
web development
Saturday, January 1, 2011
Writing XML Files in ASP.NET
Writing XML Files
The .NET Framework provides two approaches for writing XML data to a file:
• You can build the document in memory using the XmlDocument class and write it to a file
when you’re finished by calling the Save() method. The XmlDocument represents XML using
a tree of node objects.
• You can write the document directly to a stream using the XmlTextWriter. This outputs data
as you write it, node by node.
The XmlDocument is a good choice if you need to perform other operations on XML content
after you create it, such as searching it, transforming it, or validating it. It’s also the only way to write
an XML document in a nonlinear way, because it allows you to insert new nodes anywhere. However,
the XmlTextWriter provides a much simpler and better performing model for writing directly
to a file, because it doesn’t store the whole document in memory at once.
The next web-page example shows how to use the XmlTextWriter to create a well-formed XML
file. The first step is to create a private WriteXML() method that will handle the job. It begins by
creating an XmlTextWriter object and passing the physical path of the file you want to create as a
constructor argument.
private void WriteXML()
{
string xmlFile = Server.MapPath("VideoList.xml");
XmlTextWriter writer = new XmlTextWriter(xmlFile, null);
...
The XmlTextWriter has properties such as Formatting and Indentation, which allow you to
specify whether the XML data will be automatically indented with the typical hierarchical structure
and to indicate the number of spaces to use as indentation. You can set these two properties as
follows:
...
writer.Formatting = Formatting.Indented;
writer.Indentation = 3;
...
Now you’re ready to start writing the file. The WriteStartDocument() method writes the XML
declaration with version 1.0 ( <?xml version="1.0"?> ), as follows:
writer.WriteStartDocument();
The WriteComment() method writes a comment. You can use it to add a message with the date
and time of creation:
writer.WriteComment("Created @ " + DateTime.Now.ToString());
Next, you need to write the real content—the elements, attributes, and so on. This example
builds an XML document that represents a videos list, with information such as the title, the director,
the length, and a list of actors for each video. These records will be child elements of a parent
<VideoList> element, which must be created first:
writer.WriteStartElement("VideoList");
Now you can create the child nodes. The following code opens a new <VIDEO> element:
writer.WriteStartElement("VIDEO");
Now the code writes two attributes, representing the ID and the related category. This information
is added to the start tag of the <VIDEO> element.
...
writer.WriteAttributeString("ID", "1");
writer.WriteAttributeString("Category", "Science Fiction");
...
The next step is to add the elements with the information about the VIDEO inside the <VIDEO>
element. These elements won’t have child elements of their own, so you can write them and set
their values more efficiently with a single call to the WriteElementString() method. WriteElement-
String() accepts two arguments: the element name and its value (always as string), as shown here:
...
// Write some simple elements.
writer.WriteElementString("Title", "The Matrix");
writer.WriteElementString("Director", "Larry Wachowski");
writer.WriteElementString("Length", "18.74");
...
Next is a child <Starring> element that lists one or more actors. Because this element contains
other elements, you need to open it and keep it open with the WriteStartElement() method. Then
you can add the contained child elements, as shown here:
...
writer.WriteStartElement("Starring");
writer.WriteElementString("Star", "Keanu Reeves");
writer.WriteElementString("Star", "Laurence Fishburne");
...
At this point the code has written all the data for the current VIDEO. The next step is to close all
the opened tags, in reverse order. To do so, you just call the WriteEndElement() method once for
each element you’ve opened. You don’t need to specify the element name when you call WriteEnd-
Element(). Instead, each time you call WriteEndElement() it will automatically write the closing tag
for the last opened element.
...
// Close the <Starring> element.
writer.WriteEndElement();
// Close the <VIDEO> element.
writer.WriteEndElement();
...
Now let’s create another <VIDEO> element using the same approach:
...
writer.WriteStartElement("VIDEO");
// Write a couple of attributes to the <VIDEO> element.
writer.WriteAttributeString("ID", "2");
writer.WriteAttributeString("Category", "Drama");
// Write some simple elements.
writer.WriteElementString("Title", "Forrest Gump");
writer.WriteElementString("Director", "Robert Zemeckis");
writer.WriteElementString("Length", "23.99");
// Open the <Starring> element.
writer.WriteStartElement("Starring");
// Write two elements.
writer.WriteElementString("Star", "Tom Hanks");
writer.WriteElementString("Star", "Robin Wright");
// Close the <Starring> element.
writer.WriteEndElement();
// Close the <VIDEO> element.
writer.WriteEndElement();
...
This is quite straightforward, isn’t it? To complete the document, you simply need to close the
<VideoList> item, with yet another call to WriteEndElement(). You can then close the XmlTextWriter,
as shown here:
...
writer.WriteEndElement();
writer.Close();
}
Labels:
asp.net,
web development,
xml
Subscribe to:
Posts (Atom)
