Desplegable autoenviable con mensaje de confirmación en .NET

A continuación vamos a explicar cómo implementar una lista desplegable que al seleccionar un valor hace el PostBack de la página. Pero antes de dicho evento se despliega un mensaje de confirmación. Solo se dispara el evento en caso de responder afirmativamente. En caso de presionar Cancelar la página no hace nada.

En el archivo .aspx hay que declarar el control de la siguiente forma:

<asp:DropDownList ID="ddlDesplegable" runat="server" AutoPostBack="false" OnSelectedIndexChanged="ddlDesplegable_SelectedIndexChanged">
  <asp:ListItem Value="0">Valor por defecto ...</asp:ListItem>
  <asp:ListItem Value="1">Opción 1 </asp:ListItem>
  <asp:ListItem Value="2">Opción 2 </asp:ListItem>
</asp:DropDownList>

Poner AutoPostBack="false" es importante para que no dispare el PostBack por su cuenta. La propiedad OnSelectedIndexChanged dispara el método ddlDesplegable_SelectedIndexChanged, que es dónde se pone el código que queramos ejecutar al seleccionar uno de los valores de la lista.

Y ya en el código, dentro del bloque If (!IsPostBack) en el método Load de la página, tendremos que introducir algo como:

// Inicialización del valor seleccionado
if (Session["miValor"] != null)
{
  Pager.PSize = int.Parse((String)Session["miValor"]);
  ddlDesplegable.SelectedValue = (String)Session["miValor"];
}

… si queremos inicializar el valor y gestionarlo durante la carga de la página y durante las idas y venidas del PostBack.

Nota: Session["miValor"] es una implementación propia para capturar el valor.

Y ya para el mensaje de confirmación hay que introducir también en el mismo bloque este código, el cual añade la propiedad onchange en el lado del cliente.

//Mensaje de confirmación
string msg = "Seguro que quiere cambiar el estado de TODOS los elementos seleccionados?nEsta acción NO SE PODRÁ DESHACER";
ddlAccion.Attributes["onchange"] = "if (!confirm('" + msg + "')) this.selectedIndex = this.oldIndex; else setTimeout('__doPostBack('ddlDesplegable','')', 0);";

Notas:

  • el ejemplo funciona correctamenteen IE7 y Firefox2.0.
  • el mismo código javascript pero colocado en cliente (y testado en IE7) se comportaba de modo extraño (funcionaba la primera vez pero el resto ya no).
  • el código __doPostBack('ddlDesplegable','')', 0); es necesario porque si no no se hace el PostBack de la página después de confirmar el mensaje.

Otros artículos de esta serie:

[seriesposts show_date=0 order=asc]

Publicar un Comentario

Si es la primera vez que escribes, tu comentario será moderado por un administrador.

Con el fin de garantizar un ambiente de debate respetuoso, no se permitirán comentarios:

  • insultantes, difamatorios, racistas, sexistas, y/o discriminatorios
  • excesivamente críticos con otros participanes
  • que no aporten nada, sin sentido o repetidos
  • con enlaces considerados publicidad o spam
  • con material protegido por derechos de autor
*
*