Calling a web service from javascript and .net 2.0

Question

Thanks all for the help, rod.

Hi All,

Is it possible to call a web service (on my localhost) from jquery in a plain html page inside an asp.net 2.0 webform application using visual studio 2005?

<script type="text/javascript">
    $(document).ready(function(){
        $('#button1').click(function(){                
            $('#targetDiv').load('http://localhost/testservice/Service1.asmx/HelloWorld',null,function(){alert('test')});
        });
    });
</script>

I'm getting a 500 error? Not sure if it's even possible to do this way?

thanks, rod

Answer 1

Are you sure this line is correct? http://localhost/testservice/Service1.asmx/HelloWorld Have you tried calling the webservice directly through the browser?

Answer 2

Use Jquery + Ajax Instead:

http://api.jquery.com/jQuery.ajax/

Answer 3

A 500 error means your web service threw an exception. Look in the event log to find out what the problem is, or debug the web service to find out.

Answer 4

Enable web method in the web service so that it can be called with ajax.

Answer 5

By default, ASP.Net doesn't enable web methods for GET requests (which is what a data-less .load() does). Scott Guthrie has a nice blog post on how to enable GET on Web Methods.

However, keep in mind that they're disabled for a reason (security mainly), you may want to just use a $.post() instead, like this:

$('#button1').click(function(){                
  $.post('http://localhost/testservice/Service1.asmx/HelloWorld',
    function(data) { $('#targetDiv').html(data); }
  );
});

Or make .load() trigger POST with a dummy data object, like this:

$('#button1').click(function(){                
  $('#targetDiv')
    .load('http://localhost/testservice/Service1.asmx/HelloWorld', {});
});

The {} is the key, passing an object makes .load() do a POST instead of a GET.