In this post, I will show how to use Jquery in asp.net
- Start Microsoft Visual Studio. NET.
- On the File menu, point to New, and then click Project.
- In the New Project dialog box, click Visual C# Projects
- Add a new XML file and copy the following XML.
labels.xml
<?xml version="1.0" encoding="utf-8"?>
<labels>
<label id="1">
<name>Test</name>
<address>
<street>street1</street>
<city>City1</city>
<province>ID</province>
</address>
</label>
<label id='2'>
<name>Name2</name>
<address>
<street>Street2</street>
<city>City2</city>
<province>CT</province>
</address>
</label>
</labels>
- Add a reference to the [jQuery script](
- Copy below code in aspx page.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!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>
<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('#update-target a').click(function() {
$.ajax({
type: "GET",
url: "labels.xml",
dataType: "xml",
success: function(xml) {
$(xml).find('label').each(function(){
var id_text = $(this).attr('id')
var name_text = $(this).find('name').text()
$('<li></li>')
.html(name_text + ' (' + id_text + ')')
.appendTo('#update-target ol');
}); //close each(
}
}); //close $.ajax(
}); //close click(
}); //close $(
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
<div id='update-target'>
<a href="#">Click here to load addresses</a>
<ol>
</ol>
</div>
</p>
</div>
</form>
</body>
</html>