How do I make a ajax function work

Question

0.00/5 (No votes)

See more:

How do I make a ajax function work?

Error code:

JavaScript runtime error: '$' is undefined

Default.aspx

ASP.NET

<script type="text/javascript">
        function GetDateTime(json1) {
            $.ajax
            ({
                type: "POST",
                url: "Default.aspx/GetServerDateTime",
                data: json1,
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                success: function (result) {
                    alert(result.d);
                },
                error: function (err) {

                }
            });
        }
</script>
<asp:Button ID="Button1" runat="server" Text="AJAX" OnClick="Button1_Click" />

Default.aspx.cs

C#

protected void Button1_Click(object sender, EventArgs e)
        {
            string json1 = "{'one':'1','two':'2','three':'3'}";
            ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "scr", "Javascript:GetDateTime(" + json1 + ");", true);
        }
        [WebMethod]
        public static string GetServerDateTime(string one, string two, string three)
        {
            return DateTime.Now.ToString() + " " + one + two + three;
        }

Posted 18-Oct-14 21:38pm

Teledextri

Updated 18-Oct-14 22:22pm

v4

Add a Solution

Comments

[no name] 19-Oct-14 6:28am

Please check the URL which you have passed in the Ajax request. I hope there some problem would be there. Have you debugged if the server side is getting called??

3 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

Kornfeld Eliyahu Peter · Answer 1 · 2014-10-18T22:29:00

Solution 1

As I understand $ means jQuery here...
From your code it is unclear, but based on the error, you missing the include part for the jQuery library...
Something like this in your page (somewhere before your GetDateTime code):

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Posted 18-Oct-14 22:29pm

Kornfeld Eliyahu Peter

Comments

Teledextri 19-Oct-14 5:02am

Even with the jQuery site it still is not printing the alert "10/19/2014 05:00 AM 123"

Kornfeld Eliyahu Peter 19-Oct-14 5:05am

I believe that your '$ is undefined' error is gone now :-)!
Now it is time to start debugging you server and client...
The alert message does not shown because you never get to the success part of the ajax call - so check if server got hit at all and then check what the response is!

frostcox · Answer 2 · 2014-10-19T10:39:00

All your missing is the document.Ready function......

JavaScript

<script type="text/javascript">

$(function(){

        function GetDateTime(json1) {
            $.ajax
            ({
                type: "POST",
                url: "Default.aspx/GetServerDateTime",
                data: json1,
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                success: function (result) {
                    alert(result.d);
                },
                error: function (err) {
 
                }
            });
        }


});

</script>

/\jmot · Answer 3 · 2014-10-19T21:29:00

I have Done Few Changes To Your Code..
Try This..

C#

    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript">
        function GetDateTime(json1) {
            $.ajax
            ({
                type: "POST",
                url: "Default.aspx/GetServerDateTime",
                data: JSON.stringify(json1),
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                success: function (result) {
                    alert(result.d);
                },
                error: function (err) {
                    alert("Ajax Error");
                }
            });
        }
</script>

C#

protected void Button1_Click(object sender, EventArgs e)
{
    string json1 = "{'one':'1','two':'2','three':'3'}";
    ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "scr", "Javascript:GetDateTime(" + json1 + ");", true);
}
[WebMethod]
public static string GetServerDateTime(string one, string two, string three)
{
    return Convert.ToString(DateTime.Now.ToString() + " " + one + two + three);
}

How do I make a ajax function work

3 solutions

Solution 1

Solution 2

Solution 3

Add your solution here

Preview 0