-
Calling Page Method [.AJAX]
-
In this blog post, we will learn how to call a method existing on a page using Ajax.
First of all, the method should have the WebMethod attribute and should be static.
[System.Web.Services.WebMethod]
public static string GetServerTime()
{
return DateTime.Now.ToString();
}
The above method will return the date time on the server.
Second, You should add the EnablePageMethods="true" attribute to the ScriptManager control to allow calling a page method.
Now on client pageload event we will call the method on the server which will return a string containing the date time and display it on a textbox inside an UpdatePanel Control
<script language="javascript">
function pageLoad(sender, eventArgs)
{
getTime();
}
function getTime()
{
// call the method on the server and wait till the code has completed its execution
PageMethods.GetServerTime(OnGetServerTimeComplete)
}
function OnGetServerTimeComplete(result, userContext, methodName)
{
// Get the textbox inside the UpdatePanel Control
var textbox = $get('<%=txtDateTime.ClientID%>');
// Set the result into the textbox
textbox.value = result;
}
</script>
Hope this Helps,
-
Register Namespace & Classes [.AJAX]
-
Below is the code which will help you create namepsace & a class to group your client side functionalities.
function pageLoad(sender, eventArgs){
// Register the namespace
Type.registerNamespace('Hello');
// Create the World Class
Hello.World = function(test1,test2){
this._test1 = test1;
this._test2 = test2;
}
// Set its prototype
Hello.World.prototype = {
get_Title: function() {
return this._test1;
}
}
// Register the class
Hello.World.registerClass('Hello.World');
// Create new instance of the class and send the correct parameter
var test = new Hello.World('haissam','testing');
// display the value
alert(test.get_Title());
}
Best Regards,
-
Display "Loading" And Disable a button after click event [.AJAX]
-
Have you wondered how to prevent a user from clicking a button more than once in case you are inserting data into the database!! Well below is an implementation
first, what you need to do is to insert an UpdatePanel control Containing a button and a gridview. On button_click server side event copy the below code which will fetch some data from the database to be inserted into the gridview.
string connectionString = "Data Source=(local);Initial Catalog=Northwind;Integrated Security=SSPI";
SqlConnection con = new SqlConnection(connectionString);
con.Open();
SqlDataAdapter da = new SqlDataAdapter("Select * from customers", con);
DataSet ds = new DataSet();
da.Fill(ds);
System.Threading.Thread.Sleep(9000);
GridView1.DataSource = ds;
GridView1.DataBind();
Page.DataBind();
Do not forget to import System.Data.SqlClient namespace
let's remember the client side page life cycle
1- Initialize Request
2- Begin Request
3- Page Loading
4- Page Loaded
5- End Request
We will handle the below two events to achieve our goal
1- beginRequest
2- endRequest
add the below code under the <asp:ScriptManager/> control
<script language="javascript">
// Get the PageRequestManager instance
var pageRequest = Sys.WebForms.PageRequestManager.getInstance();
// Add the beginRequest Event
pageRequest.add_beginRequest(beginRequest);
// Add the endRequest Event
pageRequest.add_endRequest(endRequest)
// Handle the Begin event
function beginRequest(sender, eventArgs)
{
// Get the button
var Button1 = $get('<%=Button1.ClientID %>')
// Set its text to Loading
Button1.value = 'Loading';
// Disable the Button
Button1.disabled = true
}
function endRequest(sender, eventArgs)
{
// Get the Button
var Button1 = $get('<%=Button1.ClientID %>')
// Enable it
Button1.disabled = false;
}
</script>
Hope this Helps
-
Building a Custom Confirmation Dialog Box
-
I kindly invite you to view my latest article published at aspalliance.com
Building a Custom Confirmation Dialog Box
Best Regards,
-
Execute Javascript code on a navigation button in Wizard Control.
-
As you may know the wizard control, provided by ASP.NET 2.0, allows us to create a navigation system with multiple steps. if you are not familiar with the wizard control please check below link
Wizard Control in ASP.NET 2.0
Once you create a wizard step, you can set the StepType to dynamically create the proper navigation buttons. For this example, just select Start.
To execute a javascript function for the "Next" button, you have to find the control inside that wizard and then handle the proper event to call that method.
First, right click on the wizard control, in design mode and select "Convert to start nagivation template". Now if you look into the HTML code you will find that visual studio 2005 dynamically added the below
<StartNavigationTemplate>
<asp:Button ID="StartNextButton" runat="server" CommandName="MoveNext" Text="Next" />
</StartNavigationTemplate>
Now the Next button has an id "StartNextButton" and you can in your code behind use the below code to get this button at runtime and add the javascript code
Button nextButton = (Button)Wizard1.FindControl("StartNavigationTemplateContainerID").FindControl("StartNextButton");
nextButton.Attributes.Add("onclick","alert('This is the client click event');");
Hope this helps,
-
The App_Code Directory
-
In ASP.NET 2.0, there are seven reserved directories where each directory has its own role. In this blog post, I will introduce the App_Code directory.
This directory is not automatically created when you create a new project, however the developer has to do it manually or it will be created if any feature requests it. It is used to store source code (Classes) from the same language, these classes are compiled at runtime to be used by the pages. Because HTTP Requests are blocked by the ISAPI filters from browsing this reserved directory, do not add any file except source codes; if you try to add an image and you use this image inside the webform, it will not be displayed at runtime.
Like I already mentioned, you can't add for example VB classes and C# classes under this directory, you have to add only classes using the same language because remember at runtime these classes are compiled into a single assembly. However, if you have VB Classes and C# Classes and u want to add them to this directory consider doing the below.
For example, under this folder create two new folders:
1) CSharp
2) VB
And now in the web.config add the below configurations
<configuration>
<system.web>
<compilation>
<codeSubDirectories>
<add directoryName="CSharp"/>
<add directoryName="VB"/>
</codeSubDirectories>
</compilation>
</system.web>
</configuration>
In this way, the compiler will create 1 single assembly for each directory.
Hope this Helps,