Question

How should I format a path so it works with MVC routing in jQuery? I’m returning Json, very similar to another SO post. Everything works great locally, but deployed it just bombs out. The query runs, but checking firebug it looks like the Success callback for jQuery.Get() doesn’t fire.

LATEST UPDATE
The only issue I have now is with special characters. Anytime I pass a “.” or “@” as part of the MVC route I get a 404. Removing these special characters also removes the error. You can see the Controller and Routing logic below.

Anytime I pass a ‘.’ as part of the URL it bombs. Whats up with the periods?

Queries are of the form
/Service/Index/{email} –

Broken E.G. /Service/Index/[e-mail] (404)
Working E.G. /Service/Index/bmackeyfoocom (200)

Old stuff (for reference)

I tried "/Service/Index/email", "../Service/Index/email","../../Service/Index/email", but nothing is working.

    $email.blur(function ()
        {
            var email = $(this).val(); // grab the value in the input
            var url = '@Url.Action("Index", "Service")';    //this is calling MVC page, not normal aspx so I can't pass it as a query param (at least as far as I am aware)
            $.get(url + '/' + email.toString(), 

Update
I stopped hardcoding my URL. Local runs work perfectly. I still get a 404 error when I run on DEV server. The URL looks correct. I get a 404 error when I pass a string value, but if I change my parameter to an int I get a returned “null” (with quotes). This leads me to believe something is wrong with my Controller implementation or routing:

    public ActionResult Index(string email)
    {
        string emailAddress = email;

        GetActiveDirectoryInformation adInfo = new GetActiveDirectoryInformation();//calls entity framework
        Common_GetAdInfo_Result result = adInfo.Lookup(email: emailAddress);

        string jsonResponse = System.Web.Helpers.Json.Encode(result);           
        return Json(jsonResponse,JsonRequestBehavior.AllowGet);
    }

Global.asax

   public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                "Service",
                "Service/Index/{email}",
                new { controller = "Service", action = "Index", email = UrlParameter.Optional } // Parameter defaults
            );

            routes.MapRoute(
                "Default", // Route name
                "{controller}/{action}/{id}", // URL with parameters
                new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
            );

Answer 1

Never hardocde urls like this:

var url = '/Service/Index/' + email.toString();

Always use URL helpers when dealing with URLs:

$email.blur(function () {
    var email = $(this).val(); // grab the value in the input
    var url = '@Url.Action("Index", "Service")';
    $.get(url, { id: email.toString() }, function(result) {
        // ...
    });
});

Url helpers will always generate correct urls no matter where your application is deployed.

And if this is a separate javascript file in which you cannot use server side code you could always use HTML5 data-* attributes on your input field:

@Html.TextBoxFor(x => x.Email, new { data_url = Url.Action("Index", "Service") })

and then in your separate javascript file:

$email.blur(function () {
    var email = $(this).val(); // grab the value in the input
    var url = $(this).data('url');
    $.get(url, { id: email.toString() }, function(result) {
        // ...
    });
});