CODEWITHSUNDEEP
c#jqueryajaxasp.net-3.5handler
Devraj Gadhavi
Devraj Gadhavi

Reputation: 3611

Calling handler from jQuery doesn't work

I need to call a handler (ashx) file from jQuery to fetch some data at runtime. My jQuery function looks like:

         var pID = 3;
         var tID = 6;

         $("#Button1").click(function() {
            var urlToHandler = "Controller/TestHandler.ashx";
            $.ajax({
                type: "POST",
                url: urlToHandler,
                data: "{'pID':'" + pID + "', 'tID':'" + tID + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    alert(msg);
                }
            });
        });

My handler code:

 <%@ WebHandler Language="C#" Class="TestHandler" %>

using System;
using System.Web;

public class TestHandler : IHttpHandler
{    
    public void ProcessRequest (HttpContext context)
    {
        String pID = context.Request.Params["pID"];
        String tID = context.Request.Params["tID"];
        context.Response.ContentType = "text/plain";
        context.Response.Write(pID + " " + tID);
    }

    public bool IsReusable
    {
        get {
            return false;
        }
    }
}

The problem is the code execution doesn't reach to the handler code. I can call other web forms (aspx) files from the same jQuery function from the same directory, where the handler file is residing. So it isn't any path issue.

I am new to this handler file concept. I googled a lot but couldn't find anything wrong in my code.

Upvotes: 0

Views: 7478

Answers (2)

Devraj Gadhavi
Devraj Gadhavi

Reputation: 3611

It worked after changing the way I was passing the json data (as suggested by @DRAKO) and removing the contentType from the ajax post back call. Also corrected the path.

$("#Button1").click(function() {
    var urlToHandler = "TestHandler.ashx";
    $.ajax({
        type: "POST",
        url: urlToHandler,
        data: { pID: pID, tID: tID },
        dataType: "json",
        success: function(msg) {
            //do something with the msg here...
        }
    });
});

Upvotes: 2

DRAKO
DRAKO

Reputation: 112

I think the way you are passing the json data to the handler is incorrect.

Also make sure the path to the handler is correct and write a line to the console in the handler to check if it is getting called. Try this code out

$("#Button1").click(function(){

        $.ajax({
            type: "POST",
            url: "/Controller/TestHandler.ashx",
            data: {pID:pID, tID:tID},
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                alert(msg);
            },
            error: function(){
                alert("Error");
            }

        });
    });

Upvotes: 1

Related Questions