La llamada de JQuery Ajax da el error 404 "Recurso no encontrado", pero la llamada a la URL normal es Fina

Question

Tengo un problema extraño cuando uso la llamada JQuery en mi proyecto ASP.NET MVC. Descubrí que la llamada Ajax da 404 (error de recurso no encontrado). Pero cuando uso la llamada URL GET habitual, puedo llamar al servidor sin problemas. ¿Alguna idea de por qué esto es así?

Esta mi código ASP.NET MVC

public class ViewRecordController: Controller 
{ 
    public JSONResult GetSoftwareChoice(string username) 
    { 
    return Json(username); 
    } 
} 

Este es mi código de jQuery:

$(function() { 
$("#username").click(function() { 
     $.getJSON("ViewRecord/GetSoftwareChoice", {username:'123'}, 
    function(data) { 
     alert(data); 
    }); 
    }); 
}); 

Lo anterior jQuery me da un error 404. Aparentemente, el ViewRecord/GetSoftwareChoice no se encuentra en el servidor, en lo que respecta a la llamada AJAX.

Pero si escribo esto en mi navegador web:

http://myapp/ViewRecord/GetSoftwareChoice?username=123 

entonces no hay problema.

Esto es muy extraño, de hecho.

Sólo en caso de si está interesado, este es mi ruta:

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

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

} 

Editar: entro en mi código, y encontraron que la llamada URL es ViewRecord/GetSoftwareChoice?username=123.

pregunta relacionada: Select Element inside Form not working in JQuery

Answer 1

puedo solucionar este problema mediante el uso de FireBug para mostrarme la solicitud que se generó por jQuery.Para mi sorpresa, la URL generada es

http://localhost/ViewRecord/ViewRecord/GetSoftwareChoice?username=123 

para la llamada JSON:

$(function() { 
$("#username").click(function() { 
     $.getJSON("ViewRecord/GetSoftwareChoice", {username:'123'}, 
    function(data) { 
     alert(data); 
    }); 
    }); 
}); 

Así que sólo hay que cambiar la línea $.getJSON a

$.getJSON("GetSoftwareChoice", {username:'123'}, 

alternativa, puede utilizar la barra diagonal :

$.getJSON("/ViewRecord/GetSoftwareChoice", {username:'123'}, 

Answer 2

En lugar de difícil codificación de la URL, es posible que desee probar un UrlHelper:

$(function() { 
    $("#username").click(function() { 
     var url = '<%= UrlHelper.Action("GetSoftwareChoice", "ViewRecord") %>'; 
     $.getJSON(url, {username: '123'}, function(data) { 
      alert(data); 
     }); 
    }); 
}); 

Answer 3

Uso Firefox Firebug añadir, y ver lo que la solicitud se enviaran por jQuery. ..

¿Es posible que la página en la que se ejecuta este Jquery esté en un subdirectorio, en cuyo caso la solicitud no será relativa como la url http://myapp/ "mecanografiada" es?

Además, supongo que el código que especificó anteriormente no es en realidad el código que está usando (lo cual es completamente razonable, raramente publiqué el código tal como está). Porque

$.getJSON("ViewRecord/GetSoftwareChoice", {username='123'}, 

el signo = entre el nombre de usuario y '123' es JS no válido hasta donde yo sé. Así que estoy apostando a que hay algún detalle ridículo en el código real que está causando el problema.

Answer 4

Vuelva a colocar el signo igual con dos puntos:

$(function() { 
$("#username").click(function() { 
     $.getJSON("ViewRecord/GetSoftwareChoice", {username:'123'}, 
    function(data) { 
     alert(data); 
    }); 
    }); 
}); 

Answer 5

$(function() { 
    $("#username").click(function() { 
     $.getJSON('<%= Url.Action("GetSoftwareChoice", "ViewRecord")%>',{username: '123'}, function(data) { 
      alert(data); 
     }); 
    }); 
}); 

Answer 6

También tuve el mismo problema. Después de usar Firebug como lo había hecho Graviton, vi que mi camino no era firme, así que lo cambié al nombre de mi acción. Get_OrderLine es el nombre de mi acción en mi controlador. inv_item_id es el parámetro pasado a la acción del controlador.

// Update OrderLine data by returning a JSON result 
$('#itemsddl').click(function (e) { 
    var selectedItem = $(this).val(); 
    var actionURL = "Get_OrderLine"; 
    var d = "inv_item_id=" + selectedItem; 
    var uom = $('#uom'); 
    var size = $('#size'); 
    var unitLbs = $('#unitLbs'); 
    var totalLbs = $('#totalLbs'); 
    var shipName = $('#shipName'); 
    var hazardClass = $('#hazardClass'); 
    var unnaNo = $('#unnaNo'); 
    var packingGroup = $('#packingGroup'); 
    var placard = $('#placard'); 
    var ergNo = $('#ergNo'); 
    $.ajax({ 
     cache: false, 
     type: 'GET', 
     url: actionURL, 
     data: d, 
     datatype: JSON, 
     success: function (data) { 
      uom.val(data.uom); 
      size.val(data.size); 
      unitLbs.val(data.unitLbs); 
      totalLbs.val(data.totalLbs); 
      shipName.val(data.shipName); 
      hazardClass.val(data.hazardClass); 
      unnaNo.val(data.unnaNo); 
      packingGroup.val(data.packingGroup); 
      placard.val(data.placard); 
      ergNo.val(data.ergNo); 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
      alert('Failed to query item - ' + thrownError + "\n" + "Full details: " + xhr.responseText); 
     } 
    }); 
    e.preventDefault(); 
}); 

Esta es mi acción que devuelve un resultado JSON a mi jQuery. La función jQuery luego maneja la asignación de JSON a HTML. No es muy bonito, pero funciona.

public ActionResult Get_OrderLine(int? inv_item_id) 
{ 
    HazmatInfoItem item = new HazmatInfoItem(); 
    item.itemId = "0"; 
    item.size = "0"; 
    item.unitLbs = 0; 
    item.qty = 0; 
    item.totalLbs = item.qty * item.unitLbs; 
    item.shipName = ""; 
    item.hazardClass = ""; 
    item.unnaNo = ""; 
    item.packingGroup = ""; 
    item.placard = ""; 
    item.ergNo = ""; 

    var items = from i in hazmatRepository.GetAllItems() 
       select i; 

    // Get item details 
    items = items.Where(i => i.INV_ITEM_ID.Contains(inv_item_id.ToString())); 

    foreach (var i in items) 
    { 
     item.uom = i.UNIT_MEASURE_STD; 
     item.size = i.INV_ITEM_SIZE; 
     item.unitLbs = 1; 
     item.totalLbs = item.unitLbs * item.qty; 
     item.shipName = i.PAG_SHIPPING_NAME; 
     item.hazardClass = i.HAZ_CLASS_CD; 
     item.unnaNo = i.MSDS_ID; 
     item.packingGroup = i.PACKING_CD; 
     item.placard = i.PAG_PLACARD_TYPE; 
    } 

    return Json(item, JsonRequestBehavior.AllowGet); 
} 

Originalmente había agregado una nueva ruta para tratar de manejar esto, pero lo comenté para permitir el enrutamiento predeterminado.

Esperemos que estas soluciones puedan ayudar a alguien más que ha tenido un problema similar al intentar utilizar .ajax con jQuery y MVC.

Answer 7

función antigua:

function Chart() { 

    var url = "../Home/Pie/"; 
    $.ajax({ 
     url: url, 
     data: {}, 
     cache: false, 
     type: "POST", 
     success: function (data) { 
      var chartData = data; 
      createChart(chartData); 
      $(document).bind("kendo:skinChange", createChart); 
     }, 
     error: function (xhr, status, error) { 
      $('#alertdialog').html(status); 
      $('#alertdialog').dialog('open'); 
      return false; 
     } 
    }); 
} 

Respuestas: var url = "Inicio/Pie/"; Eliminado ../ de la url