Ajax not making function call

Question

I have ajax function as:

function LoadTeacherObservationData(_CategoryID, _SearchText) {
        alert("In here");
        alert(_CategoryID);
        alert(_SearchText);
        flag = 1;
        $.ajax({
            url: "PP/getTeacherObservationData",
        data: {
        'CategoryID': _CategoryID,
        'SearchText': _SearchText
        },
    dataType: "json",
        type: 'POST',
    cache:false,
    success: function (data) {
        OnlebelChange(_CategoryID);
        $('#hdnCategoryID').val(_CategoryID);

        $("#lvTeacherData").kendoListView({
            dataSource: data,
            dataBound: function(e) {
                if(this.dataSource.data().length == 0){
                    //custom logic
                    $("#lvTeacherData").append("<h4>&nbsp;&nbsp;No record found.</h4>");

                }},
            template: kendo.template($("#lvTeacherData_Template").html())
        });
    },
    error: function () {
        alert("error in click");
    }
    });
    }

I have made sure that function is getting called with correct parameters as i have checked it through alert box.

My problem is its not getting rendered to:

PP/getTeacherObservationData as i have mentioned in URL.

PP is my controller and getTeacherObservationData is my function.

I have written that function as follows:

public JsonResult getTeacherObservationData(string CategoryID, string SearchText)
        {
            try
            {
                if (CategoryID == "1")
                    return Json(new TeacherObservation().ScheduledObserVations(SearchText));
                if (CategoryID == "2")
                    return Json(new TeacherObservation().InProcessObservations(SearchText));
                if (CategoryID == "3")
                   return Json(new TeacherObservation().CompletedObservations(SearchText));

                return Json(new List<TeacherObservation>());
            }
            catch (Exception ex)
            {
                throw ex;
            }
        }

Instead of calling this function ajax function code goes in error block and gives me alert as: error in click

What can be the problem??

Please help me.

I want to make function call through ajax.

Using MVC4.

Then your URL isn't right. Try `/PP/getTeacherObservationData` to go to the root instead of relative. — MrCode, Jun 04 '14 at 09:45
@MrCode It worked...If you post this as answer i will accept it... :) thank you — C Sharper, Jun 04 '14 at 09:51

score 2 · Accepted Answer · edited May 23 '17 at 12:20

Expanding on my comment: the URL PP/getTeacherObservationData is relative so if you are currently not in the root of the site, then this won't work.

Using a forward slash prefix /PP/getTeacherObservationData will work if your site is in the root of the domain.

You could also use one of the solutions in this answer. Such as ResolveUrl("~/") to dynamically get the site's root, which is better because it's more portable. For example if you move your site out of the domain's root and into a directory, this will continue to work unlike hard coding the root.

score 0 · Answer 2 · answered Jun 04 '14 at 09:43

I don't know what PHP Framework you are using, but normally you can't just return a value to an AJAX call, you have to ouput it somehow to send it back to the caller. Try to use echo or print instead of return.

To prevent further rendering (if any), you should somehow end the script after it has echoed your specified JSON.

You should also check for the output that is rendered in firebug or similar consoles to see if you get a plain JSON (which you obvoiously expect) or some HTML wrapped content which is rendered by your php framework and connot be parsed.

Sorry my fault for not checking the prerequisites right. Since it's a 404 you are getting there my answer will not add too much useful information for you - but in general that's how I would check for errors here, independent of the framework. Cheers! — Liquinaut, Jun 04 '14 at 09:51

Ajax not making function call

2 Answers2