Simple ajax with asp.net

Here is a simple example of ajax using asp.net.

Create a asp.net web project named AjaxTest. In defaut.aspx page add the following code:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Default.aspx.cs" Inherits="AjaxTest._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<script type="text/javascript">
var xmlhttp = null;
function ShowSuggestions(str) {
if (str.length == 0) {
document.getElementById("txtHint").innerHTML = "";
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
var url = "Search.aspx?q=" + str;
xmlhttp.open("GET", url, false);
xmlhttp.send(null);
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
</script>
<h2>
Welcome to ASP.NET AJAX!
</h2>
<input type="text" id="txt1″" onkeyup="ShowSuggestions(this.value)" />
<p>
Suggestions: <span id="txtHint"></span>
</p>
</asp:Content>
--------------------------------------------

Add a page named Search.aspx

Add the following code in the code behind page

protected void Page_Load(object sender, EventArgs e)
{
var sugtext = new List<string>();
sugtext.Add("Rayhan");
sugtext.Add("Tonmoy");
string suggestion = (from sgText in sugtext
where sgText.StartsWith(Request.QueryString["q"])
select sgText).FirstOrDefault();
//string suggestion="Hello";
if (string.IsNullOrEmpty(suggestion))
Response.Write("No Suggestion Found");
else
Response.Write(suggestion);
Response.End();
}

 

 

Build and see the action.

Opening a child page and doing some operations and return back to the parent page

I was given a task in my asp.net project that when I click on an item of a grid view the item details will be displayed in another child page and then some changes will be accepted on that child page and finally I have to close the child page and refresh the parent page.

For the task I used javascript. I searched the internet and got many solutions. I tried several and finally I got my solution. I am sharing with you my solution.

I wrote the following code in my parentpage.aspx
<script type="text/javascript">
function openNewChild(itemcode) {
var myvar = window.open('./childpage.aspx?ItemCode='+itemcode,'test','titlebar=0, toolbar=0, location=0, height=280');
}
</script>

I also need a TemplateField item in my grid view  to show the Item link which look like this:

<asp:TemplateField HeaderText="Item Name" SortExpression="ItemName"><EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("ItemName") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:HyperLink ID="HyperLink2" runat="server" Text='<%# Bind("ItemName") %>' NavigateUrl='<%# Eval("ILCode", "javascript:openNewChild(\"{0}\")") %>'>
</asp:HyperLink>
</ItemTemplate>

<HeaderStyle HorizontalAlign="Left" />
<ItemStyle HorizontalAlign="Left" />
</asp:TemplateField>

And in the my childpage.aspx  I took and button and On its click event I used the following code:

protected void btnUpdate_Click(object sender, EventArgs e)
{
if (CheckValidation() == true)
{
SaveData();
ClientScript.RegisterStartupScript(Page.GetType(), "test", "<script language='javascript' type='text/javascript'>alert('Updated successfully.');window.close();window.opener.location.href = window.opener.location;</script>");
}
}

The Save Data function does my neccessary job for updating my database. the ClientScript.RegisterStartupScript() method closes the child window and the reloads my parent page.
Thats all :)
If you have any question feel free to ask me. I’ll try answer your question and I am also sorry for my bad English.