Click here to Skip to main content
12,501,105 members (43,710 online)
Click here to Skip to main content
Add your own
alternative version

Stats

31K views
11 bookmarked
Posted

Calling ASP.NET Webservice using JavaScript on Regular Interval of Time

, 5 Sep 2013 CPOL
Rate this:
Please Sign up or sign in to vote.
This tip describes how to call a webservice using JavaScript and also calling that webservice in a regular interval of time without doing a postback in the page.

Introduction

This tip describes how to call a webservice using JavaScript and also calling that webservice in a regular interval of time without doing a postback in the page.

Here it uses simple JavaScript, JQuery, and ASP.NET Webservice.

The webservice is calling in a regular interval of time without doing a page postback.

Background

You should have basic knowledge about ASP.NET, JavaScript and webservice. This can be applied to SharePoint page as well, by editing the page and put the JavaScript code using SharePoint designer. Currently, it will work only in Internet Explorer 8, not with Internet Explorer 9.

Using the Code

Core Steps

  1. Create an ASP.NET webservice
  2. Create an ASP.NET web site

Steps in Details

1. Create an ASP.NET Webservice

Create a new project 'ASP.NET Web Service Application' in Visual Studio.

Open the 'Service1.asmx.cs' file and uncomment the following line from the attribute section of the class 'Service1. This change is for allowing the webservice to be called from script.

[System.Web.Script.Services.ScriptService]

By default, you will have a method "HelloWorld" in the class 'Service1'.

Make the class like below. This method will return the current time in the server.

[WebMethod]
        public string HelloWorld()
        {
            TimeSpan time = DateTime.Now.TimeOfDay;
            return time.ToString();
        }

Build the webservice project and we will add this webservice in the ASP.NET website project to check whether the webservice is available to use. I will describe this below.

Now, the webservice is ready.

2. Create an ASP.NET Web Site

In the same project (WebService Project), add 'New Project -> New Web Site' and choose 'ASP.NET Web Forms Site' and choose 'File System' as the web location.

Test the Web Service Created in the Above Step

Once you create the new website project, then we can test our web service (created in the first step).

  1. Right click on the website project.
  2. Add Service Reference.
  3. Click on 'Discover' button. It will show the webservice in the window. You can use that webservice URL for accessing the service.
  4. In the browser, access that URL and check whether your webservice is showing 'HelloWorld' method in the browser.

Now, we can go to the implementation of calling webservice using JavaScript in the page 'Default.aspx'.

Steps

  1. Download 'webservice.htc' file from the Microsoft site and put this file in the same place where 'Default.aspx' is residing in the project. Calling webservice using this method 'webservice.htc', is one of the methods, we can have other methods also for calling the webservice using JavaScript.
  2. Open the 'Default.aspx' file and put the following controls in the <form> tag.
    <div id="myWebService" style="behavior:url('webservice.htc')" onresult="getResult()"></div>
            <asp:Label ID="Result" runat="server">Result will be here.</asp:Label>
        </div> 
  3. Put the following JavaScript code in the <head> tag.
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

Here replace the service URL (http://localhost:46668/Service1.asmx?wsdl[^]) with your webservice URL.

JavaScript Code Explanation

  • setInterval method is calling the method every 2000 milliseconds (2 seconds).
  • Method CallWebService is calling the webservice using JavaScript method.
  • Here 'myWebService' is the id of the div control.
  • In 'useService' method, the first argument is the webservice URL with ?wsdl in the ending, and the second argument is any name you like.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Praveen Chandran
Technical Lead Infosys Limited
India India
No Biography provided

You may also be interested in...

Pro
Pro

Comments and Discussions

 
GeneralMy vote of 2 Pin
amol_th15-Jan-15 1:18
memberamol_th15-Jan-15 1:18 
Questionwdsl Pin
dalepo12343-Dec-13 14:06
memberdalepo12343-Dec-13 14:06 
Suggestioncall to WebService / WCF using JQuery Pin
hemantrhtk10-Nov-13 19:40
memberhemantrhtk10-Nov-13 19:40 
GeneralRe: call to WebService / WCF using JQuery Pin
arunk52510-Mar-14 5:50
memberarunk52510-Mar-14 5:50 
QuestionThere is a better way... Pin
Dewey5-Sep-13 13:56
memberDewey5-Sep-13 13:56 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.160919.1 | Last Updated 5 Sep 2013
Article Copyright 2013 by Praveen Chandran
Everything else Copyright © CodeProject, 1999-2016
Layout: fixed | fluid