CODEWITHSUNDEEP
jqueryasp.net-mvc-3
Arun Rana
Arun Rana

Reputation: 8606

Routing issue in MVC3 application on IIS

I have created MVC3 application with razor and using jquery (beginner level) and it's working fine. After that i have hosted this application on IIS (created MVCDemo Virtual directory) and it's working fine except when i have make post request using jquery.

Consider the following request using jquery 

$.ajax({
            type: "POST",
            data: { 'username': $("#UserName").val() },
            async: false,
            url: "/Wizard/ValidateUserName",
            success: function (data) {
                if (data) {
                    $('#divUser').html("Username is  available");
                    $('#divUser').removeClass("field-validation-error");
                }
                else {
                    $('#divUser').html("Username is not available");
                    $('#divUser').removeClass("field-validation-valid");
                    $('#divUser').addClass("field-validation-error");
                }
                datavalue = data;
            },
            error: function (xhr, ajaxoptions, throwError) {
                alert(xhr.responseText);
            }
        });

if i will change URL: MVCdemo/Wizard/ValidateUserName then this will work correct way otherwise gives error of 404.

So how can i handle this type of routing globally in MVC3 application?

Upvotes: 3

Views: 275

Answers (3)

Jason
Jason

Reputation: 11615

This should work as well:

function checkUserAvailbility() {
    var datavalue = false;
    $.ajax({
        type: "POST",
        data: { 'username': $("#UserName").val() },
        async: false,
        url: "@Url.Content("~/Wizard/ValidateUserName")",
        success: function (data) {
            if (data) {
                $('#divUser').html("Username is  available");
                $('#divUser').removeClass("field-validation-error");
            }
            else {
                $('#divUser').html("Username is not available");
                $('#divUser').removeClass("field-validation-valid");
                $('#divUser').addClass("field-validation-error");
            }
            datavalue = data;
        },
        error: function (xhr, ajaxoptions, throwError) {
            alert(xhr.responseText);
        }
    });
    return datavalue;
}

Upvotes: 0

amit patel
amit patel

Reputation: 2297

you need to use MVC razor syntax in jQuery function.

Like below........

 function checkUserAvailbility() {
    var datavalue = false;
    $.ajax({
        type: "POST",
        data: { 'username': $("#UserName").val() },
        async: false,
        url: '@Url.Action("ValidateUserName", "Wizard")',
        success: function (data) {
            if (data) {
                $('#divUser').html("Username is  available");
                $('#divUser').removeClass("field-validation-error");
            }
            else {
                $('#divUser').html("Username is not available");
                $('#divUser').removeClass("field-validation-valid");
                $('#divUser').addClass("field-validation-error");
            }
            datavalue = data;
        },
        error: function (xhr, ajaxoptions, throwError) {
            alert(xhr.responseText);
        }
    });
    return datavalue;
}

See the diff between url:(property) of jQuery.

Upvotes: 2

Ivo
Ivo

Reputation: 8352

Jquery is going to the actual url. If you put just /Wizard/ValidateUserName in your browser, it won't work either.

The easy way to solve it is to configure iis to work in the same way yo expect, so you don't need to add the "MVCDemo" prefix for the virtual directory.

Upvotes: 0

Related Questions