Realizamos una función que muestra un mensaje modalpopup dinámicamente desde C# hasta javascript, funciona bien pero queríamos agregar un parámetro para poder pasar una función delegar (o controlador de eventos) que se llamaría si el usuario presiona el botón Aceptar. ¿Alguna sugerencia?ASP.NET C# Arreglo para el evento OK de una ConfirmMessagebox personalizada dentro de una biblioteca de funciones
Postdata: no queremos la típica solución de "confirmar que desea presionar este botón", pero una función para pedir confirmación en cualquier parte del proceso si es necesario. Ejemplo: usuario haga clic en eliminar elemento botón, en código detrás de comprobar que el elemento tiene alguna dependencia así que muestre un mensaje de confirmación con la función mensaje pasando el delegado deleteitemconfirmed(), si el usuario hace clic en Aceptar llame al delegado ...
Función en la biblioteca:
public static void Mensaje(string mensaje, EventHandler EventoClickLLamar, bool botoncancelar, string cssclass, Color colorfondo)
{
string colorfondox = ColorTranslator.ToHtml(colorfondo);
string idbotonok = EventoClickLLamar == null ? "" : EventoClickLLamar.Method.Name.Replace("_Click", "");
string script =
" function verifyStyle(selector) {" + " \r\n" +
" var rules;" + " \r\n" +
" var haveRule = false;" + " \r\n" +
" " + " \r\n" +
" if (typeof document.styleSheets != \"undefined\") { //is this supported" + " \r\n" +
" var cssSheets = document.styleSheets;" + " \r\n" +
" " + " \r\n" +
" outerloop:" + " \r\n" +
" for (var i = 0; i < cssSheets.length; i++) {" + " \r\n" +
" " + " \r\n" +
" //using IE or FireFox/Standards Compliant" + " \r\n" +
" rules = (typeof cssSheets[i].cssRules != \"undefined\") ? cssSheets[i].cssRules : cssSheets[i].rules;" +
" \r\n" +
" " + " \r\n" +
" for (var j = 0; j < rules.length; j++) {" + " \r\n" +
" if (rules[j].selectorText == selector) {" + " \r\n" +
" haveRule = true;" + " \r\n" +
" break outerloop;" + " \r\n" +
" }" + " \r\n" +
" }//innerloop" + " \r\n" +
" " + " \r\n" +
" }//outer loop" + " \r\n" +
" }//endif" + " \r\n" +
" " + " \r\n" +
" return haveRule;" + " \r\n" +
" }//eof" + " \r\n" +
" function setFading(o, b, e, d, f) {" + " \r\n" +
" var t = setInterval" + " \r\n" +
" (" + " \r\n" +
" function() {" + " \r\n" +
" b = stepFX(b, e, 2);" + " \r\n" +
" setOpacity(o, b/100);" + " \r\n" +
" if (b == e) {" + " \r\n" +
" if (t) { clearInterval(t); t = null; }" + " \r\n" +
" if (typeof f == 'function') { f(); }" + " \r\n" +
" }" + " \r\n" +
" }" + " \r\n" +
" , d/50);" + " \r\n" +
" }" + " \r\n" +
" function setOpacity(e, o) {" + " \r\n" +
" // for IE" + " \r\n" +
" e.style.filter = 'alpha(opacity=' + o * 100 + ')';" + " \r\n" +
" // for others" + " \r\n" +
" e.style.opacity = o;" + " \r\n" +
" }" + " \r\n" +
" function stepFX(b, e, s) {" + " \r\n" +
" return b > e ? b - s > e ? b - s : e : b < e ? b + s < e ? b + s : e : b;" + " \r\n" +
" }" + " \r\n" +
" // we may consider adding frames support" + " \r\n" +
" var w = window;" + " \r\n" +
" // shortcut to document" + " \r\n" +
" var d = w.document;" + " \r\n" +
" // canvas, window width and window height" + " \r\n" +
" var r = d.documentElement;" + " \r\n" +
" var ww = w.innerWidth ? w.innerWidth + w.pageXOffset : r.clientWidth + r.scrollLeft;" + " \r\n" +
" var wh = w.innerHeight ? w.innerHeight + w.pageYOffset : r.clientHeight + r.scrollTop;" + " \r\n" +
" // create a block element" + " \r\n" +
" var b = d.createElement('div');" + " \r\n" +
" b.id = 'Message';" + " \r\n" +
" b.className = '" + cssclass + "' || '';" + " \r\n" +
" b.style.cssText = 'top:-9999px;left:-9999px;position:absolute;white-space:nowrap;z-index: 1001;';" +
" \r\n" +
" // classname not passed, set defaults" + " \r\n" +
" if (!verifyStyle(\"." + cssclass + "\")) {" + " \r\n" +
" b.style.margin = '0px 0px';" + " \r\n" +
" b.style.padding = '8px 8px';" + " \r\n" +
" b.style.border = '1px solid #A4BED0';" + " \r\n" +
" b.style.backgroundColor = '#E0ECF1';" + " \r\n" +
" }" + " \r\n" +
" var bx = d.createElement('div');" + " \r\n" +
" bx.style.cssText = 'position: absolute;left:0px;top:0px;width:100%;height:100%;text-align:center;z-index: 1000;background-color: " + //va seguido sin salto
colorfondox + ";opacity:0.5;filter:alpha(opacity=50);'" + " \r\n" +
" d.body.insertBefore(bx, d.body.firstChild);" + " \r\n" +
" d.body.insertBefore(b, d.body.firstChild); " + " \r\n" +
" // write HTML fragment to it " + " \r\n" +
" b.innerHTML = '<table><tr><td>" + mensaje + "</td></tr><tr><td align=\"center\">" +
(string.IsNullOrEmpty(idbotonok)
? "<input type=\"submit\" value=\"Aceptar\" onClick=\"disabled=true;setFading(b, 100, 0, 1000, function() { d.body.removeChild(bx); d.body.removeChild(b); });\" >"
: "<input type=\"submit\" value=\"Aceptar\" onClick=\"__doPostBack(\\'" + idbotonok + "\\',\\'\\')\" id=\"" + idbotonok + "\" >") +
(botoncancelar
? "<input type=\"submit\" value=\"Cancelar\" onClick=\"disabled=true;setFading(b, 100, 0, 1000, function() { d.body.removeChild(bx); d.body.removeChild(b); });\" >"
: "") +
"</td></tr></table>';" + " \r\n" +
" // save width/height before hiding " + " \r\n" +
" var bw = b.offsetWidth;" + " \r\n" +
" var bh = b.offsetHeight;" + " \r\n" +
" // hide, move and then show" + " \r\n" +
" b.style.display = 'none';" + " \r\n" +
" b.style.top = (wh/2 - bh/2) + 'px'; //center" + " \r\n" +
" b.style.left = (ww/2 - bw/2) + 'px'; //center" + " \r\n" +
" b.style.display = 'block';" + " \r\n";
ScriptManager.RegisterClientScriptBlock((Page)HttpContext.Current.Handler, typeof(Page), "mensaje", script, true);
}
página de prueba:
public partial class Test: Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
btnDeleteItem_Click(object sender, EventArgs e)
{
//DB checks
....
....
//After x checks against Database we see the item has some dependency so we ask for confirmation
FunctionsLibrary.Mensaje("This Item has x dependency, are you sure you want to delete it?", btnDeleteItemConfirmed_Click, true, "cssclassx", System.Drawing.Color.Gray);
}
btnDeleteItemConfirmed_Click(object sender, EventArgs e)
{
//delete item definitively, handle dependencies etc...
}
}
opciones que no podíamos hacer el trabajo (en caso de que estábamos en pista, pero algo estaba mal):
Caso 1: (El que se implementó en nuestro código de ejemplo) Usar EventHandler + __doPostBack así que si tiene el buttonid_click definido en su página, sería invocado en la devolución de datos. (El evento no aumentó ... supongo que fue porque no agregamos el control Ok en la carga de la página ... lo cual nos da el caso 2)
Caso 2: Guardar la función de delegado pasada, registrar evento Página .load + = GetPostBackControlID(), en la siguiente página GetPostBackControlID carga() se llama, hay que comprobar si el ID de control se hace clic es nuestro botón de OK, si así se llame a la función de delegado
me gustaría considerar el cambio a Silverlight y zanja esa horrible horrible de la pared en línea JS – Alex
@alex preferimos usar javascript o ajax de una función contenida en lugar de usar tiempos de ejecución – VSP