Create an object for each request of single client or multiple clients. This is stateless
Server Application
Student.cs
[sourcecode language="csharp"]
[Serializable]
public class Student
{
public int stuId;
public string stuName;
public int total;
public float avg;
}
[/sourcecode]
GradeApp.cs
[sourcecode language="csharp"]
public class GradeApp : MarshalByRefObject
{
public GradeApp()
{
Console.WriteLine("A new client connected");
}
public float calcAvg(int total)
{
return total / 8;
}
public Student getAvg(int total)
{
Student s = new Student();
s.avg = calcAvg(total);
return s;
}
}
[/sourcecode]
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(8001);
ChannelServices.RegisterChannel(tcp,false);
RemotingConfiguration.RegisterWellKnownServiceType(typeof(GradeApp),"server",WellKnownObjectMode.SingleCall);
Console.ReadKey();
[/sourcecode]
Client Application
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(0);
ChannelServices.RegisterChannel(tcp, false);
string url = "tcp://localhost:8001/server";
RemotingConfiguration.RegisterWellKnownClientType(typeof(GradeApp),url);
GradeApp ga = new GradeApp();
Student st1 = ga.getAvg(756);
Console.WriteLine("Average is : " + st1.avg;)
Console.WriteLine("Average is : " + st1.avg;)
Student st2 = ga.getAvg(746);
Console.WriteLine("Average is : " + st2.avg);
Console.ReadKey();
[/sourcecode]
Wednesday, March 21, 2012
.NET Remoting - Server Activated Singleton
Use the same object for every client. This is statefull.
Server Application
Student.cs
[sourcecode language="csharp"]
[Serializable]
public class Student
{
public int stuId;
public string stuName;
public int total;
public float avg;
}
[/sourcecode]
GradeApp.cs
[sourcecode language="csharp"]
public class GradeApp : MarshalByRefObject
{
public GradeApp()
{
Console.WriteLine("A new client connected");
}
public float calcAvg(int total)
{
return total / 8;
}
public Student getAvg(int total)
{
Student s = new Student();
s.avg = calcAvg(total);
return s;
}
}
[/sourcecode]
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(8001);
ChannelServices.RegisterChannel(tcp,false);
RemotingConfiguration.RegisterWellKnownServiceType(typeof(GradeApp),"server",WellKnownObjectMode.Singleton);
Console.ReadKey();
[/sourcecode]
Client Application
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(0);
ChannelServices.RegisterChannel(tcp, false);
string url = "tcp://localhost:8001/server";
RemotingConfiguration.RegisterWellKnownClientType(typeof(GradeApp),url);
GradeApp ga = new GradeApp();
Student st1 = ga.getAvg(756);
Console.WriteLine("Average is : " + st1.avg;)
Student st2 = ga.getAvg(746);
Console.WriteLine("Average is : " + st2.avg);
Console.ReadKey();
[/sourcecode]
Server Application
Student.cs
[sourcecode language="csharp"]
[Serializable]
public class Student
{
public int stuId;
public string stuName;
public int total;
public float avg;
}
[/sourcecode]
GradeApp.cs
[sourcecode language="csharp"]
public class GradeApp : MarshalByRefObject
{
public GradeApp()
{
Console.WriteLine("A new client connected");
}
public float calcAvg(int total)
{
return total / 8;
}
public Student getAvg(int total)
{
Student s = new Student();
s.avg = calcAvg(total);
return s;
}
}
[/sourcecode]
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(8001);
ChannelServices.RegisterChannel(tcp,false);
RemotingConfiguration.RegisterWellKnownServiceType(typeof(GradeApp),"server",WellKnownObjectMode.Singleton);
Console.ReadKey();
[/sourcecode]
Client Application
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(0);
ChannelServices.RegisterChannel(tcp, false);
string url = "tcp://localhost:8001/server";
RemotingConfiguration.RegisterWellKnownClientType(typeof(GradeApp),url);
GradeApp ga = new GradeApp();
Student st1 = ga.getAvg(756);
Console.WriteLine("Average is : " + st1.avg;)
Student st2 = ga.getAvg(746);
Console.WriteLine("Average is : " + st2.avg);
Console.ReadKey();
[/sourcecode]
.NET Remoting - Client Activated Objects
Create an object for each client. Use the same object for multiple requests from the same client.
Server Application
Student.cs
[sourcecode language="csharp"]
[Serializable]
public class Student
{
public int stuId;
public string stuName;
public int total;
public float avg;
}
[/sourcecode]
GradeApp.cs
[sourcecode language="csharp"]
public class GradeApp : MarshalByRefObject
{
public GradeApp()
{
Console.WriteLine("A new client connected");
}
public float calcAvg(int total)
{
return total / 8;
}
public Student getAvg(int total)
{
Student s = new Student();
s.avg = calcAvg(total);
return s;
}
}
[/sourcecode]
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(8001);
ChannelServices.RegisterChannel(tcp,false);
RemotingConfiguration.RegisterActivatedServiceType(typeof(GradeApp));
Console.ReadKey();
[/sourcecode]
Client Application
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(0);
ChannelServices.RegisterChannel(tcp, false);
string url = "tcp://localhost:8001";
RemotingConfiguration.RegisterActivatedClientType(typeof(GradeApp),url);
GradeApp ga = new GradeApp();
Student st1 = ga.getAvg(756);
Console.WriteLine("Average is : " + st1.avg);
[/sourcecode]
Server Application
Student.cs
[sourcecode language="csharp"]
[Serializable]
public class Student
{
public int stuId;
public string stuName;
public int total;
public float avg;
}
[/sourcecode]
GradeApp.cs
[sourcecode language="csharp"]
public class GradeApp : MarshalByRefObject
{
public GradeApp()
{
Console.WriteLine("A new client connected");
}
public float calcAvg(int total)
{
return total / 8;
}
public Student getAvg(int total)
{
Student s = new Student();
s.avg = calcAvg(total);
return s;
}
}
[/sourcecode]
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(8001);
ChannelServices.RegisterChannel(tcp,false);
RemotingConfiguration.RegisterActivatedServiceType(typeof(GradeApp));
Console.ReadKey();
[/sourcecode]
Client Application
Program.cs
[sourcecode language="csharp"]
TcpChannel tcp = new TcpChannel(0);
ChannelServices.RegisterChannel(tcp, false);
string url = "tcp://localhost:8001";
RemotingConfiguration.RegisterActivatedClientType(typeof(GradeApp),url);
GradeApp ga = new GradeApp();
Student st1 = ga.getAvg(756);
Console.WriteLine("Average is : " + st1.avg);
[/sourcecode]
Sunday, March 18, 2012
PHP User Class
[sourcecode language="php"]
<?php
class User
{
private $user_id;
private $username;
private $password;
private $email;
protected static $table_name="lbs_user";
public function __construct($username="",$password="",$email="")
{
$this->username = $username;
$this->password = $password;
$this->email = $email;
}
/* Add a new user.
* Returns true on success, false on error */
public function getUserId()
{
return $this->user_id;
}
public function create()
{
global $gdbObj;
$username = $gdbObj->escape_value($this->username);
$password = $gdbObj->escape_value($this->password);
$email = $gdbObj->escape_value($this->email);
$sql = "INSERT INTO ".self::$table_name." (username,password,email) values('$username','$password','$email')";
if($gdbObj->query($sql))
{
$this->user_id = $gdbObj->insert_id();
return true;
}
else
{
return false;
}
}
/* Update user profile.
* Returns true on success, false on error */
public function update()
{
}
/* Remove an user.
* Returns true on success, false on error */
public function delete()
{
}
}
$guserObj = new User();
?>
[/sourcecode]
<?php
class User
{
private $user_id;
private $username;
private $password;
private $email;
protected static $table_name="lbs_user";
public function __construct($username="",$password="",$email="")
{
$this->username = $username;
$this->password = $password;
$this->email = $email;
}
/* Add a new user.
* Returns true on success, false on error */
public function getUserId()
{
return $this->user_id;
}
public function create()
{
global $gdbObj;
$username = $gdbObj->escape_value($this->username);
$password = $gdbObj->escape_value($this->password);
$email = $gdbObj->escape_value($this->email);
$sql = "INSERT INTO ".self::$table_name." (username,password,email) values('$username','$password','$email')";
if($gdbObj->query($sql))
{
$this->user_id = $gdbObj->insert_id();
return true;
}
else
{
return false;
}
}
/* Update user profile.
* Returns true on success, false on error */
public function update()
{
}
/* Remove an user.
* Returns true on success, false on error */
public function delete()
{
}
}
$guserObj = new User();
?>
[/sourcecode]
PHP/MySQL Sample Database Class
[sourcecode language="php"]
<?php
class MySqlDatabase
{
private $_connection;
public $last_query;
private $magic_quotes_active;
private $real_escape_string_exists;
public function __construct()
{
$this->open_connection();
/* Returns the current configuration setting of magic_quotes_gpc.
Returns 0 if magic_quotes_gpc is off, 1 otherwise. */
$this->magic_quotes_active = get_magic_quotes_gpc();
$this->real_escape_string_exists = function_exists("mysql_real_escape_string");
}
public function open_connection()
{
$this->_connection = mysql_connect(DB_SERVER,DB_USER,DB_PASS);
if(!$this->_connection)
{
die('Database connection failed'.mysql_error());
}
else
{
$db_select = mysql_select_db(DB_NAME,$this->_connection);
if(!$db_select)
{
die('Database selection failed'.mysql_error());
}
}
}
public function close_connection()
{
if(isset($this->_connection))
{
mysql_close($this->_connection);
unset($this->_connection);
}
}
/* For SELECT returns resultset on success, false on error.
* For INSERT, UPDATE, DELETE etc returns true on success, false on error */
public function query($sql)
{
$this->last_query = $sql;
$result = mysql_query($sql,$this->_connection);
$this->confirm_query($result);
return $result;
}
/* Make sure query executed successfully.
* Only for debugging purposes. */
private function confirm_query($result)
{
if(!$result)
{
$output = "Databse query failed".mysql_error()."<br>";
$output .= "Last query ".$this->last_query;
die($output);
}
}
/* Escape special characters in the string before sending to the database
* Consider PHP Version*/
public function escape_value($value)
{
if($this->real_escape_string_exists)// PHP version 4.3.0 or higher
{
if($this->magic_quotes_active)
{
/* Automatically add back slashes when magic quotes are active in php.ini
* First remove them. */
$value = stripslashes($value);
}
//Escapes special characters in a string
$value = mysql_real_escape_string($value);
}
else //before PHP version 4.3.0
{
if(!$this->magic_quotes_active)
{
// Add slashes manually
$value = addslashes($value);
}
}
return $value;
}
/* Returns an array of strings that corresponds to the fetched row.
* Returns FALSE if there are no more rows.*/
public function fetch_array($result_set)
{
return mysql_fetch_array($result_set);
}
/* Retrives the number of rows from the result set.
* Returns FALSE on failure. */
public function num_rows($result_set)
{
return mysql_num_rows($result_set);
}
/* Get the ID generated in the last query
* 0 if the previous query does not generate an AUTO_INCREMENT value.
* FALSE if no MySQL connection was established. */
public function insert_id()
{
return mysql_insert_id($this->_connection);
}
/* Get number of affected rows in previous MySQL operation.
* Return -1 if the last query failed. */
public function affected_rows()
{
return mysql_affected_rows($this->_connection);
}
}
//Creates an object from MySQLDatabase class
$gdbObj = new MySqlDatabase();
?>
[/sourcecode]
<?php
class MySqlDatabase
{
private $_connection;
public $last_query;
private $magic_quotes_active;
private $real_escape_string_exists;
public function __construct()
{
$this->open_connection();
/* Returns the current configuration setting of magic_quotes_gpc.
Returns 0 if magic_quotes_gpc is off, 1 otherwise. */
$this->magic_quotes_active = get_magic_quotes_gpc();
$this->real_escape_string_exists = function_exists("mysql_real_escape_string");
}
public function open_connection()
{
$this->_connection = mysql_connect(DB_SERVER,DB_USER,DB_PASS);
if(!$this->_connection)
{
die('Database connection failed'.mysql_error());
}
else
{
$db_select = mysql_select_db(DB_NAME,$this->_connection);
if(!$db_select)
{
die('Database selection failed'.mysql_error());
}
}
}
public function close_connection()
{
if(isset($this->_connection))
{
mysql_close($this->_connection);
unset($this->_connection);
}
}
/* For SELECT returns resultset on success, false on error.
* For INSERT, UPDATE, DELETE etc returns true on success, false on error */
public function query($sql)
{
$this->last_query = $sql;
$result = mysql_query($sql,$this->_connection);
$this->confirm_query($result);
return $result;
}
/* Make sure query executed successfully.
* Only for debugging purposes. */
private function confirm_query($result)
{
if(!$result)
{
$output = "Databse query failed".mysql_error()."<br>";
$output .= "Last query ".$this->last_query;
die($output);
}
}
/* Escape special characters in the string before sending to the database
* Consider PHP Version*/
public function escape_value($value)
{
if($this->real_escape_string_exists)// PHP version 4.3.0 or higher
{
if($this->magic_quotes_active)
{
/* Automatically add back slashes when magic quotes are active in php.ini
* First remove them. */
$value = stripslashes($value);
}
//Escapes special characters in a string
$value = mysql_real_escape_string($value);
}
else //before PHP version 4.3.0
{
if(!$this->magic_quotes_active)
{
// Add slashes manually
$value = addslashes($value);
}
}
return $value;
}
/* Returns an array of strings that corresponds to the fetched row.
* Returns FALSE if there are no more rows.*/
public function fetch_array($result_set)
{
return mysql_fetch_array($result_set);
}
/* Retrives the number of rows from the result set.
* Returns FALSE on failure. */
public function num_rows($result_set)
{
return mysql_num_rows($result_set);
}
/* Get the ID generated in the last query
* 0 if the previous query does not generate an AUTO_INCREMENT value.
* FALSE if no MySQL connection was established. */
public function insert_id()
{
return mysql_insert_id($this->_connection);
}
/* Get number of affected rows in previous MySQL operation.
* Return -1 if the last query failed. */
public function affected_rows()
{
return mysql_affected_rows($this->_connection);
}
}
//Creates an object from MySQLDatabase class
$gdbObj = new MySqlDatabase();
?>
[/sourcecode]
Saturday, March 10, 2012
Track file upload errors in PHP
[sourcecode language="php"]
<?php
if(isset($_POST['btn_upload']))
{
$upload_errors = array(
UPLOAD_ERR_OK => "No errors.",
UPLOAD_ERR_INI_SIZE => "Larger than upload_max_filesize.",
UPLOAD_ERR_FORM_SIZE => "Larger than form MAX_FILE_SIZE.",
UPLOAD_ERR_PARTIAL => "Partial upload.",
UPLOAD_ERR_NO_FILE => "No file.",
UPLOAD_ERR_NO_TMP_DIR => "No temporary directory.",
UPLOAD_ERR_CANT_WRITE => "Can't write to disk.",
UPLOAD_ERR_EXTENSION => "File upload stopped by extension."
);
$error = $_FILES['file_upload']['error'];
$message = $upload_errors[$error];
echo $message;
}
?>
[/sourcecode]
<?php
if(isset($_POST['btn_upload']))
{
$upload_errors = array(
UPLOAD_ERR_OK => "No errors.",
UPLOAD_ERR_INI_SIZE => "Larger than upload_max_filesize.",
UPLOAD_ERR_FORM_SIZE => "Larger than form MAX_FILE_SIZE.",
UPLOAD_ERR_PARTIAL => "Partial upload.",
UPLOAD_ERR_NO_FILE => "No file.",
UPLOAD_ERR_NO_TMP_DIR => "No temporary directory.",
UPLOAD_ERR_CANT_WRITE => "Can't write to disk.",
UPLOAD_ERR_EXTENSION => "File upload stopped by extension."
);
$error = $_FILES['file_upload']['error'];
$message = $upload_errors[$error];
echo $message;
}
?>
[/sourcecode]
Get uploaded file information in PHP
[sourcecode language="php"]
<?php
if(isset($_POST['btn_upload']))
{
echo '<pre>';
print_r($_FILES['file_upload']);
echo '</pre>';
}
?>
[/sourcecode]
[sourcecode language="html"]
<form action="upload.php" method="post" enctype="multipart/form-data">
<input name="file_upload" type="file" />
<input name="btn_upload" type="submit" value="Upload" />
</form>
[/sourcecode]
<?php
if(isset($_POST['btn_upload']))
{
echo '<pre>';
print_r($_FILES['file_upload']);
echo '</pre>';
}
?>
[/sourcecode]
[sourcecode language="html"]
<form action="upload.php" method="post" enctype="multipart/form-data">
<input name="file_upload" type="file" />
<input name="btn_upload" type="submit" value="Upload" />
</form>
[/sourcecode]
Tuesday, March 6, 2012
code zone jQuery Crash Course – Day 5 | Working with images
Changing image opacity
[sourcecode language="javascript"]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$('document').ready(function(){
$('#myDiv img').hover(function(){
$(this).animate({"opacity" : "0.5"});
},
function(){
$(this).animate({"opacity" : "1.0"});
});
});
</script>
</head>
<body>
<div id="myDiv">
<img src="image.jpg" width="113" height="113" /></div>
</body>
</html>
[/sourcecode]
[sourcecode language="javascript"]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$('document').ready(function(){
$('#myDiv img').hover(function(){
$(this).animate({"opacity" : "0.5"});
},
function(){
$(this).animate({"opacity" : "1.0"});
});
});
</script>
</head>
<body>
<div id="myDiv">
<img src="image.jpg" width="113" height="113" /></div>
</body>
</html>
[/sourcecode]
code zone jQuery Crash Course - Day 4 | Simple timed animation
[sourcecode language="javascript"]
<html>
<head>
<title>Simple Animation</title>
<style type="text/css">
#myDiv
{
width:300px;
height:200px;
background-color:#0C0;
}
</style>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$('document').ready(function(){
$('#myLink').click(function(){
$('#myDiv').animate({"width" : "50px"},1000);
$('#myDiv').animate({"height" : "50px"},1000);
$('#myDiv').animate({"width" : "100px","height" : "100px"},2000);
});
});
</script>
</head>
<body>
<a href="#" id="myLink">Click Me</a>
<div id="myDiv">
</div>
</body>
</html>
[/sourcecode]
<html>
<head>
<title>Simple Animation</title>
<style type="text/css">
#myDiv
{
width:300px;
height:200px;
background-color:#0C0;
}
</style>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$('document').ready(function(){
$('#myLink').click(function(){
$('#myDiv').animate({"width" : "50px"},1000);
$('#myDiv').animate({"height" : "50px"},1000);
$('#myDiv').animate({"width" : "100px","height" : "100px"},2000);
});
});
</script>
</head>
<body>
<a href="#" id="myLink">Click Me</a>
<div id="myDiv">
</div>
</body>
</html>
[/sourcecode]
code zone jQuery Crash Course - Day 3 | Handling items and lists
Today I ' m going to show you how to create a dynamic list using jQuery. In the following code, user can add or remove item from the list simply by clicking the relevant link.
[sourcecode language="javascript"]
<html>
<head>
<title>Simple Animation</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$('document').ready(function(){
var size = $('option').size() + 1;
$('#addItem').click(function()
{
$('<option>' + size + '</option>').appendTo('#list');
size++;
});
$('#removeItem').click(function()
{
$('option:last').remove();
size--;
});
});
</script>
</head>
<body>
<a href="#" id="addItem">Add</a> | <a href="#" id="removeItem">Remove</a>
<select name="list" id="list">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</body>
</html>
[/sourcecode]
[sourcecode language="javascript"]
<html>
<head>
<title>Simple Animation</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$('document').ready(function(){
var size = $('option').size() + 1;
$('#addItem').click(function()
{
$('<option>' + size + '</option>').appendTo('#list');
size++;
});
$('#removeItem').click(function()
{
$('option:last').remove();
size--;
});
});
</script>
</head>
<body>
<a href="#" id="addItem">Add</a> | <a href="#" id="removeItem">Remove</a>
<select name="list" id="list">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</body>
</html>
[/sourcecode]
Monday, March 5, 2012
code zone jQuery Crash Course - Day 2 | Introduction to animation basics
It 's very easy to add some animation in jQuery. You only need to change the code a little bit. Some code snippets are listed below to understand animation basics in jQuery.
[sourcecode language="javascript"]
$(document).ready(function()
{
$('div#content').hide();
$('a#link').click(function()
{
$('div#content').show('slow');
});
});
[/sourcecode]
Using slideDown() to control the fall of content
This will cause to fall the content inside the div as a drop down content.
[sourcecode language="javascript"]
$(document).ready(function()
{
$('div#content').hide();
$('a#link').click(function()
{
$('div#content').slideDown('slow');
});
});
[/sourcecode]
Using fadeOut() to control the fading effect
[sourcecode language="javascript"]
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#content
{
background-color:#00F;
width:300px;
height:200px;
}
</style>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('a#link').click(function()
{
$('div#content').fadeOut('slow');
});
});
</script>
</head>
<body>
<a href="#" id="link">Click Me</a>
<div id="content">
</div>
</body>
</html>
[/sourcecode]
[sourcecode language="javascript"]
$(document).ready(function()
{
$('div#content').hide();
$('a#link').click(function()
{
$('div#content').show('slow');
});
});
[/sourcecode]
Using slideDown() to control the fall of content
This will cause to fall the content inside the div as a drop down content.
[sourcecode language="javascript"]
$(document).ready(function()
{
$('div#content').hide();
$('a#link').click(function()
{
$('div#content').slideDown('slow');
});
});
[/sourcecode]
Using fadeOut() to control the fading effect
[sourcecode language="javascript"]
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#content
{
background-color:#00F;
width:300px;
height:200px;
}
</style>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('a#link').click(function()
{
$('div#content').fadeOut('slow');
});
});
</script>
</head>
<body>
<a href="#" id="link">Click Me</a>
<div id="content">
</div>
</body>
</html>
[/sourcecode]
code zone jQuery Crash Course - Day 1
Create a new HTML file.
include the jQuery library in source code with <script>
Example 1 : Display alert message
[sourcecode language="javascript"]
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
alert("Page loaded");
});
</script>
[/sourcecode]
In jQuery, accessing HTML elements is based on CSS selectors. You can use the HTML element, element id attribute or element class name to for reference purposes.
View this file using web browser. If everything works fine, you 'll see the alert message.
Example 2 : Hide content
[sourcecode language="javascript"]
$(document).ready(function()
{
$('div#content').hide();
});
[/sourcecode]
Add the above code snippet within javaScript section and add a div container with some dummy text within body section. The div id is content for this scenario. When the browser loads the page you won't see the text within the div container.
Example 3 : Hide and display content
[sourcecode language="javascript"]
<html>
<head>
<title>jQuery Examples</title>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('div#content').hide();
$('a#link').click(function()
{
$('div#content').show();
});
});
</script>
</head>
<body>
<a href="#" id="link">Click Me</a>
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
</div>
</body>
</html>
[/sourcecode]
include the jQuery library in source code with <script>
Example 1 : Display alert message
[sourcecode language="javascript"]
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
alert("Page loaded");
});
</script>
[/sourcecode]
In jQuery, accessing HTML elements is based on CSS selectors. You can use the HTML element, element id attribute or element class name to for reference purposes.
View this file using web browser. If everything works fine, you 'll see the alert message.
Example 2 : Hide content
[sourcecode language="javascript"]
$(document).ready(function()
{
$('div#content').hide();
});
[/sourcecode]
Add the above code snippet within javaScript section and add a div container with some dummy text within body section. The div id is content for this scenario. When the browser loads the page you won't see the text within the div container.
Example 3 : Hide and display content
[sourcecode language="javascript"]
<html>
<head>
<title>jQuery Examples</title>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('div#content').hide();
$('a#link').click(function()
{
$('div#content').show();
});
});
</script>
</head>
<body>
<a href="#" id="link">Click Me</a>
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
</div>
</body>
</html>
[/sourcecode]
code zone jQuery Crash Course
Welcome to code zone jQuery Crash Course. This is just the beginning of a comprehensive tutorial session covering jQuery technology. These tutorials are prepared with the target of those who are new to jQuery. In other words, this course is for absolute beginners. Let's get started!
What is jQuery?
This is how jQuery.com defines this technology "jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript."
First of all, you need jQuery library which can be downloaded from http://docs.jquery.com/Downloading_jQuery
Use your favorite HTML editor for manipulating HTML and javaScript.
Copy the jQuery library into your project folder.
Day 1 - Simple jQuery application
Day 2 - Introduction to animation basics
Day 3 - Handling Items and lists
Day 4 - Simple timed animation
Day 5 - Working with images
Subscribe to:
Posts (Atom)
-
< Requirements Java Development Kit (JDK) NetBeans IDE Apache Axis 2 Apache Tomcat Server Main Topics Setup Development Environ...
-
Download Sourcecode [sourcecode language="csharp"] using System; using System.Collections.Generic; using System.Linq; using System...
