c# - una - ASP.NET MVC-¿Cómo llamar al método del controlador de anulación sin abandonar la vista?
vista fuertemente tipada (7)
Básicamente, la etiqueta @Html.ActionLink()
o <a></a>
usa get request para localizar la página. Por lo tanto, cada vez que haga clic en él, solicitará a su método de acción AddToCart en ProductController y si ese método de acción devuelve un valor nulo o nulo, se mostrará una página en blanco o vacía como la experimentó (porque o @ Html.ActionLink () recibe una solicitud por defecto).
Entonces, si desea agregar su valor al carrito, llame al método AddToCart usando ajax, es decir:
HTML:
@Html.ActionLink("Add To Cart", "AddToCart", null, new { id="myLink"})
Jquery o Javascript:
$("#myLink").click(function(e){
e.preventDefault();
$.ajax({
url:$(this).attr("href"), // comma here instead of semicolon
success: function(){
alert("Value Added"); // or any other indication if you want to show
}
});
});
Método ''AddToCart'' en el ProductController:
public void AddToCart()
{
//Logic to add item to the cart.
}
Ahora, esta vez, cuando la llamada pasa al método AddToCart , utiliza ajax, por lo que toda la página no redirigirá ni cambiará, pero es una llamada asíncrona que ejecuta el método de acción AddToCart en su Controlador de Producto y la página actual seguirá siendo la misma. Por lo tanto, el producto también se agregará al carrito y la página no cambiará a blanco.
Espero que esto ayude.
Fondo de la pregunta:
Estoy implementando una lógica básica de ''carrito de compras'' en una aplicación MVC. Actualmente, cuando hago clic en un enlace, se indica como "Agregar al carrito" en la captura de pantalla debajo de esta llamada a un método "AddToCart" en el "Control de Producto" como se muestra:
Código de Product.cshtml:
@Html.ActionLink("Add To Cart", "AddToCart")
Método ''AddToCart'' en el ProductController:
public void AddToCart()
{
//Logic to add item to the cart.
}
La cuestión:
No es un problema como tal, pero actualmente cuando hago clic en el botón ''Agregar al carrito'' en ActionLink en la vista ProductDetail.cshtml, la página llama al método ''AddToCart'' en el ProductController y da una vista en blanco en la página, como se muestra a continuación. Quiero que la vista permanezca en ''ProductDetail.cshtml'' y simplemente llame al método ''AddToCart'', ¿cómo hago esto?
Como mucha gente mencionó aquí, necesitará usar AJAX si usa asp.net MVC para alcanzar una función POST del controlador sin tener que dejar su vista.
Un buen caso de uso para esto es si desea cargar un archivo sin actualizar la página y guardarlo en el servidor.
Toda la
return new EmptyResult();
No funcionará, todavía te redirigirán.
Así es como lo hace, en su opinión, tenga el siguiente formulario como ejemplo:
<form enctype="multipart/form-data" id="my-form">
<p>
The CSV you want to upload:
</p>
<input type="file" class="file-upload" name="FileUpload" />
</div>
<div>
<button type="submit" class="btn btn-default" name="Submit" value="Upload">Upload</button>
</div>
</form>
Luego, en el lado de JavaScript, debe agregar esto a su vista con las etiquetas de Script.
$("#my-form").on(''submit'', function (event) {
event.preventDefault();
// create form data
var formData = new FormData();
//grab the file that was provided by the user
var file = $(''.file-upload'')[0].files[0];
// Loop through each of the selected files.
formData.append(''file'', file);
if (file) {
// Perform the ajax post
$.ajax({
url: ''/YourController/UploadCsv'',
data: formData,
processData: false,
contentType: false,
type: ''POST'',
success: function (data) {
alert(data);
}
});
}
});
Su controlador puede tener un aspecto similar al siguiente para procesar este tipo de archivo:
[HttpPost]
public void UploadCsv()
{
var listOfObjects = new List<ObjectModel>();
var FileUpload = Request.Files[0]; //Uploaded file
//check we have a file
if (FileUpload.ContentLength > 0)
{
//Workout our file path
string fileName = Path.GetFileName(FileUpload.FileName);
string path = Path.Combine(Server.MapPath("~/App_Data/"), fileName);
//Try and upload
try
{
//save the file
FileUpload.SaveAs(path);
var sr = new StreamReader(FileUpload.InputStream);
string csvData = sr.ReadToEnd();
foreach (string r in csvData.Split(''/n'').Skip(1))
{
var row = r;
if (!string.IsNullOrEmpty(row))
{
//do something with your data
var dataArray = row.Split('','');
}
}
}
catch (Exception ex)
{
//Catch errors
//log an error
}
}
else
{
//log an error
}
}
El controlador debe devolver ActionResult. En este caso un redireccionamiento a la página del llamante.
Estaba luchando con esto y no podía hacerlo funcionar con ajax.
Finalmente, obtuve una solución funcional haciendo que mi método de controlador devuelva el tipo ActionResult en lugar de anularlo y devuelva un RedirectToAction () e ingrese la acción relacionada con la vista en la que quería permanecer cuando llamé al método del controlador.
public ActionResult Method()
{
// logic
return RedirectToAction("ActionName");
}
Hay muchas formas de lograr lo que quieres, pero algunas de ellas requieren un conocimiento mucho más avanzado de cosas como JavaScript de lo que parece.
Cuando escribe aplicaciones ASP.NET MVC, debe tener un conocimiento más profundo de cómo interactúan los navegadores con el servidor web. Esto sucede a través de un protocolo llamado HTTP. Es un protocolo simple en la superficie, pero tiene muchos detalles sutiles que necesita comprender para escribir aplicaciones ASP.NET MVC con éxito. También necesitas saber más sobre HTML, CSS y JavaScript.
En su caso, está creando una etiqueta de anclaje ( <a href="..."/>
), que al hacer clic en, le indica al navegador que navegue a la url en el href. Es por eso que obtienes una página diferente.
Si no quieres eso, hay varias formas de cambiar tu aplicación. Lo primero sería que, en lugar de usar un ActionLink, en lugar de eso simplemente tenga un formulario y publique los valores nuevamente en su controlador actual. Y llame a su código de "agregar al carrito" desde su método de acción posterior.
Otra forma sería que su método AddToCart mire el encabezado del remitente (de nuevo, parte de ese conocimiento más sutil de http) y redirija a esa página después de que haya procesado su trabajo.
Otra forma sería utilizar Ajax, según lo sugerido por Syed, en el que el navegador envía los datos a su controlador de forma asíncrona. Esto requiere que aprendas más sobre JavaScript.
Otra opción es usar un iframe incrustado y hacer que su "agregar al carrito" sea su propia página dentro de ese iframe. No necesariamente sugeriría ese enfoque, pero es una posibilidad.
La respuesta de Syed Muhammad Zeeshan es lo que estás buscando, sin embargo, puedes devolver un EmptyResult.
public ActionResult AddToCart()
{
//Logic to add item to the cart.
return new EmptyResult();
}
De acuerdo con esto, no tiene ningún impacto en su código ASP.Net MVC Controller Acciones que devuelven el vacío Sin embargo, tal vez en algún momento quiera devolver datos y luego podría hacer algo como esto:
if (a)
{
return JSon(data);
}
else
{
return new EmptyResult();
}
- utilizando System.Web.Mvc;
utilizando System.Web.Mvc.Html;
public ActionResult Index() { HtmlHelper helper = new HtmlHelper(new ViewContext(ControllerContext, new WebFormView(ControllerContext, "Index"), new ViewDataDictionary(), new TempDataDictionary(), new System.IO.StringWriter()), new ViewPage()); helper.RenderAction("Index2"); return View(); } public void Index2(/*your arg*/) { //your code }