Maslow
Maslow

Reputation: 18746

How do I call a controller method from JQuery?

I have ajax code for asp.net (non-mvc) to call to a webMethod to get additional data from the server for a request. But I can't seem to figure out the url to give my JQuery in MVC.

<script type="text/javascript" language="javascript">
function SubmitAjax(url, message, successFunc, errorFunc) {
    $.ajax({
        type:"POST",
        url:url,
        data:message,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success:successFunc,
        error:errorFunc
        });

};

I don't want to pass the entire list of related data to a select list to every person that arrives at the page, as not all will need this functionality. So I'd like to call a controller or webmethod via JQuery, but can't seem to find out how to address the URL in MVC.

I noticed this post: JQuery Ajax call gets resolved to the current Controller Folder, Instead of root Folder

is $.getJson an mvc method? is this a good solution for my use case? I only need to return a string url, or an empty string if what i'm looking for is not found. Do I need to include a for the $.getJSon method? is that part of MVC or part of JQuery? Is the leading slash going to point to Application root or server root?

Upvotes: 7

Views: 15503

Answers (5)

mdm20
mdm20

Reputation: 4563

This is what I've been doing lately, and it's been working fine.

  1. Get the root path and store it in a hidden input (replace [ with <)

    [input id="urlBase" type="hidden" value="<%= Url.Content("~") %>" />

  2. Get the value of that input and store it in js (using jquery in this case)

    _urlBase = $("#urlBase").val();

  3. Use that variable to call controllers

    $.ajax({ type: "GET", url: _urlBase + "Controller/Action", dataType: "json" });

Upvotes: 1

Maslow
Maslow

Reputation: 18746

The problem was the webMethod Tag on the controller, that was needed or helpful in asp.net, but not in asp.net mvc

Upvotes: 0

Mattias Jakobsson
Mattias Jakobsson

Reputation: 8237

Well, my guess is that you are having trouble with how url's are constructed. If you don't have a slash before the url it will be relative to your current url. So if the current url is: /Home/Index and you have a link like this: <a href="Ticket/CheckForInstaller">Text</a> then that link will point to the following url: /Home/Index/Ticket/CheckForInstaller. This is always the behavior in the browser. The same thing happens if you have a page in a folder in a webforms application. There is nothing different with a asp.net mvc url then with any other web framework. The url you want is probably this one: /Ticket/CheckForInstaller.

The asp.net mvc framework does, however, supply you with helpers so that you don't have to hard code any url. You can do that like this:

<%=Url.Action("Ticket", "CheckForInstaller")%>

But the only thing this will do is find the appropriate url that points to that action ("/Ticket/CheckForInstaller", depending on your routes) and write it out.

Upvotes: 2

Nrj
Nrj

Reputation: 6831

You can use $.getJSON(url,[data],[callback(data)]) where data is your returned json data object.

Alternatively you can use $.post(url,[data],[callback(data)]) where data is you returened string / data object.

url : it is the relative url to your controller/action/script which returns json/data back.

The above are jquery methods and you shoul be able to use if you have included jquery js file.

Upvotes: 1

Johannes Setiabudi
Johannes Setiabudi

Reputation: 2077

Try this post: Basic AJAX example with ASP.NET MVC?

or this one: How to get the Json object for drop down?

They should give you some pointers.

In essence, $.getJson is a jQuery method, not an MVC one, but use want to use that in combination with your MVC controller returning a Json result.

Upvotes: 3

Related Questions