Hacer una llamada Ajax simple al controlador en asp.net mvc
Estoy intentando comenzar con las llamadas ASP.NET MVC Ajax.
Controlador:
public class AjaxTestController : Controller
{
//
// GET: /AjaxTest/
public ActionResult Index()
{
return View();
}
public ActionResult FirstAjax()
{
return Json("chamara", JsonRequestBehavior.AllowGet);
}
}
Vista:
<head runat="server">
<title>FirstAjax</title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var serviceURL = '/AjaxTest/FirstAjax';
$.ajax({
type: "POST",
url: serviceURL,
data: param = "",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: successFunc,
error: errorFunc
});
function successFunc(data, status) {
alert(data);
}
function errorFunc() {
alert('error');
}
});
</script>
</head>
Solo necesito imprimir una alerta con el método del controlador devolviendo datos. El código anterior simplemente imprime "chamara" en mi opinión. No se activa una alerta.
ACTUALIZAR
Modifiqué mi controlador como se muestra a continuación y comenzó a funcionar. No tengo una idea clara de por qué está funcionando ahora. Alguien por favor explique. El parámetro "a" no está relacionado. Lo agregué porque no puedo agregar dos métodos con el mismo nombre de método y parámetros. Creo que esta podría no ser la solución, pero está funcionando.
public class AjaxTestController : Controller
{
//
// GET: /AjaxTest/
[HttpGet]
public ActionResult FirstAjax()
{
return View();
}
[HttpPost]
public ActionResult FirstAjax(string a)
{
return Json("chamara", JsonRequestBehavior.AllowGet);
}
}
Elimine el atributo de datos ya que no es POSTING
nada para el servidor (su controlador no espera ningún parámetro).
Y en tu método AJAX puedes usar Razor
y usar @Url.Action
en lugar de una cadena estática:
$.ajax({
url: '@Url.Action("FirstAjax", "AjaxTest")',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: successFunc,
error: errorFunc
});
De su actualización:
$.ajax({
type: "POST",
url: '@Url.Action("FirstAjax", "AjaxTest")',
contentType: "application/json; charset=utf-8",
data: { a: "testing" },
dataType: "json",
success: function() { alert('Success'); },
error: errorFunc
});
Después de la actualización que has realizado,
- es la primera vez que llama a la acción FirstAjax con la solicitud HttpGet predeterminada y muestra la vista HTML en blanco. (Antes no lo tenías)
- Más adelante, al cargar los elementos DOM de esa vista, su llamada Ajax se activa y muestra una alerta.
Anteriormente solo devolvías JSON al navegador sin representar HTML. Ahora tiene una vista HTML renderizada donde puede obtener sus datos JSON.
No puede representar directamente JSON con datos simples, no con HTML.
Utilice Razor para cambiar dinámicamente su URL llamando a su acción de esta manera:
$.ajax({
type: "POST",
url: '@Url.Action("ActionName", "ControllerName")',
contentType: "application/json; charset=utf-8",
data: { data: "yourdata" },
dataType: "json",
success: function(recData) { alert('Success'); },
error: function() { alert('A error'); }
});
Si solo necesita presionar el método C# en su llamada Ajax, solo necesita pasar dos tipos de materia y la URL, si su solicitud es get, solo necesita especificar la URL. Siga el código a continuación, está funcionando bien.
Código C#:
[HttpGet]
public ActionResult FirstAjax()
{
return Json("chamara", JsonRequestBehavior.AllowGet);
}
Código de script Java si obtiene solicitud
$.ajax({
url: 'home/FirstAjax',
success: function(responce){ alert(responce.data)},
error: function(responce){ alert(responce.data)}
});
Código Java Script si se solicita una publicación y también [HttpGet] a [HttpPost]
$.ajax({
url: 'home/FirstAjax',
type:'POST',
success: function(responce){ alert(responce)},
error: function(responce){ alert(responce)}
});
Nota: Si realiza FirstAjax en el mismo controlador en el que está su controlador de vista, entonces no es necesario introducir el nombre del controlador en la URL. comourl: 'FirstAjax',