CODEWITHSUNDEEP
javascriptc#jqueryasp.netajax
C Sharper
C Sharper

Reputation: 8646

Ajax not giving me server side function call

I have simple ajax as:

 $.ajax({
    url: "http://localhost:50488/siteadmin3/search.aspx/TestJquery",
    type: "post",
    data: { id: '100', Name: 'Nilesh' },

    success:function(result){

        alert(result);
    },
    error: function (error) {
        alert(error);
    }
});

My server side function is on search.aspx:

[WebMethod()]
public static string TestJquery(string id, string Name)
{
    return string.Format("Employee Id : {0} Name : {1} ", id, Name);
}

But this function never gets called.

What can be the issue?

Edit1:

> <!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> SA- Back
> office</title><link id='Link1' runat='server' rel='shortcut icon'
> href='images/favicon-pyle.ico' type='image/x-icon' /> <link id='Link2'
> runat='server' rel='icon' href='images/favicon-pyle.ico'
> type='image/favicon.ico' />    <style type="text/css">         <!--
> body,td  { font-family: verdana, helvetica; font-size: 11px; color:
> #555555; } input.search { font-size: 9px; padding: 0px; margin: 0px; margin-top: 3px; } A:link  { text-decoration: none; } A:visited {
> text-decoration: none; } A:hover  { text-decoration: underline; }
> A.foot  { color: #ffffff; } .carea  { line-height: 16px; } .foot  {
> font-size: 9px; }--></style>      <script type="text/javascript"
> src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
> <script type="text/javascript"
> src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
> <script type="text/javascript">        function CallJquery() {        
> $.ajax({                url: "/siteadmin3/login.aspx/TestJquery",     
> type: "post",                data:  JSON.stringify({ id: '100', Name:
> 'Nilesh' }) ,                                success: function
> (result) {                    alert(result);                },        
> erro...rue, &quot;&quot;, &quot;&quot;, false, false))" id="test" />  
> <script type="text/javascript">//<![CDATA[var Page_Validators =  new
> Array(document.getElementById("RequiredFieldValidator1"),
> document.getElementById("RequiredFieldValidator2"));//]]></script><script
> type="text/javascript">//<![CDATA[var RequiredFieldValidator1 =
> document.all ? document.all["RequiredFieldValidator1"] :
> document.getElementById("RequiredFieldValidator1");RequiredFieldValidator1.controltovalidate
> = "adminName";RequiredFieldValidator1.errormessage = "User Required";RequiredFieldValidator1.evaluationfunction =
> "RequiredFieldValidatorEvaluateIsValid";RequiredFieldValidator1.initialvalue
> = "";var RequiredFieldValidator2 = document.all ? document.all["RequiredFieldValidator2"] :
> document.getElementById("RequiredFieldValidator2");RequiredFieldValidator2.controltovalidate
> = "adminpassword";RequiredFieldValidator2.errormessage = "Password Required";RequiredFieldValidator2.evaluationfunction =
> "RequiredFieldValidatorEvaluateIsValid";RequiredFieldValidator2.initialvalue
> = "";//]]></script><script type="text/javascript">//<![CDATA[var Page_ValidationActive = false;if (typeof(ValidatorOnLoad) ==
> "function") {    ValidatorOnLoad();}function ValidatorOnSubmit() {   
> if (Page_ValidationActive) {        return ValidatorCommonOnSubmit(); 
> }    else {        return true;    }}       
> //]]></script></form></body></html>

Upvotes: 0

Views: 153

Answers (3)

ScarletMerlin
ScarletMerlin

Reputation: 475

Do not hard code your Url. You want to aim at something like: 

    $.ajax({
    url: "/search/TestJquery",
    type: "post",
    data: { id: '100', Name: 'Nilesh' },

    success:function(result){

        alert(result);
    },
    error: function (error) {
        alert(error);
    }
});

And ofcourse declare your server side function as: 

[HttpPost]
public static string TestJquery(string id, string Name)
{
    return string.Format("Employee Id : {0} Name : {1} ", id, Name);
}

Upvotes: 1

hutchonoid
hutchonoid

Reputation: 33326

First you need to enable page methods in your script manager like so:

<asp:ScriptManager runat="server" EnablePageMethods="true">

You also need to set your content type and data type:

Your content type needs to be:

contentType: "application/json; charset=utf-8"

And your data type needs to be:

dataType: "json"

Which would be as follows:

$.ajax({
    url: "http://localhost:50488/siteadmin3/search.aspx/TestJquery",
    type: "post",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    data: { id: '100', Name: 'Nilesh' },

    success:function(result){

        alert(result);
    },
    error: function (error) {
        alert(error);
    }
});

Upvotes: 2

Fatih Ayyildiz
Fatih Ayyildiz

Reputation: 377

My approach is: Put [HttpPost] attribute right before your method.Like this : 

[WebMethod()]
[HttpPost]
public static string TestJquery(string id, string Name)
{
    return string.Format("Employee Id : {0} Name : {1} ", id, Name);
}

Upvotes: 1

Related Questions