Ajax With Javascript

 Rate It (1)

Create a simple page like

Default.aspx


<%@ Page Language="VB" %>

<!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>
    <title>Untitled Page</title>

    <script language="Javascript">
function xmlhttpPost(strURL) {
   // alert(strURL)
    var xmlHttpReq = false;
    var self = this;
    // Mozilla/Safari
    if (window.XMLHttpRequest) {
        self.xmlHttpReq = new XMLHttpRequest();
    }
    // IE
    else if (window.ActiveXObject) {
        self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
    }
    self.xmlHttpReq.open('POST', strURL, true);
    self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    self.xmlHttpReq.onreadystatechange = function() {
        if (self.xmlHttpReq.readyState == 4) {alert('hi');
            updatepage(self.xmlHttpReq.responseText);
        }
    }
    self.xmlHttpReq.send(getquerystring());
}

function getquerystring() {
    //var form     = document.forms['f1'];
//    var word = form.word.value;
//    qstr = 'w=' + escape(word);  // NOTE: no '?' before querystring
//    return qstr;
}

function updatepage(str){
    alert(str)
    document.getElementById("result").innerHTML = str;
}
    </script>

</head>
<body>
   <form name="f1">
  <p>word: <input name="word" type="text"> 
  <input value="Go" type="button"
        onclick='JavaScript:xmlhttpPost("http://localhost:2835/website1/WebService.asmx/HelloWorld")'></p>
  <div id="result"></div>
    </form>
</body>
</html>

Then Create a webservice

Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols

<WebService(Namespace:="http://tempuri.org/")> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _
Public Class WebService
     Inherits System.Web.Services.WebService

    <WebMethod()> _
    Public Function HelloWorld() As String
        Return "Hello World"
    End Function

End Class

 

http://dotnetclassic.com/post/AjaxWithJavascript.aspx 

Revision number 1, Tuesday, April 01, 2008 8:38:46 AM by m imran shafiq

Comments

Related Articles

Javascript and Client Scripting

JavaScript holds it all together on the client side. There are a number of extensions that have been made to improve and expand base JavaScript object functionality. Blog Posts Four ASP.NET AJAX JavaScript UI Methods You Should Learn: Dave Ward describes more

AJAX Localization and Globalization

Internationalizing AJAX and JavaScript can be a little trickier than just internationalizing a plan HTML page. Guy Smith-Ferrier on Internationalization - A great PDF slide deck of a talk that Guy did on AJAX and i18n. Localizing Resources for Component Libraries

AJAX Control Toolkit

Learn how to extend your ASP.NET AJAX applications using the ASP.NET AJAX Control Toolkit. ASP.NET AJAX Control Toolkit: Installation and getting started is a video that starts with the basics, including downloading and installing the toolkit. Blog Posts Four

AJAX

Asynchronous JavaScript and XML - It's Ajax and it's everywhere. Start at the ASP.NET Ajax site and work from there...there's a ton of resources at your disposal! Ajax Showcase - Check out some of the great sites that been built using Ajax. Ajax

Shortcuts

Table of Contents

Top Wiki Contributors

(last 30 days)

  1. bmains (13)
  2. XIII (13)
  3. vik20000in (8)
  4. mbanavige (7)
  5. anas (5)
  6. tmorton (5)
  7. k_nitin_r (3)
  8. binoj7 (3)
  9. scott@elbandit.co.uk (2)
  10. sciguy65 (1)

Advertise Here