Insertar javascript dinámicamente

Muchas veces puede resultar necesario generar código javascript dinámicamente e insertarlo en nuestra página. Con ASP.NET es muy sencillo hacerlo, y para ello se ofrecen dos alternativas: RegisterStartupScript y RegisterClientScriptBlock.

Las diferencias entre ambos es que el primero conecta el script cuando se carga la página, y el segundo lo hace cuando le llamamos desde cualquier control.

Ojo, porque en ASP.NET 1.1 se podían usar desde Page.RegisterStartupScript(...), pero en ASP.NET 2.0 esas funciones son ya deprecated: siguen funcionando pero no se aconseja. En cambio, ahora tenemos que trabajar con el ClientScriptManager que podemos obtener desde Page.ClientScript.

Pero vamos con un ejemplo y así quedará más claro:

Type cstype = this.GetType();
string nombreScript = "alertar";
ClientScriptManager cs = Page.ClientScript;
StringBuilder sb = new StringBuilder();
sb.AppendLine("function quieroAlertar()");
sb.AppendLine("{");
sb.AppendLine("alert('Estoy alertando');");
sb.AppendLine("}");

/*if (!cs.IsClientScriptBlockRegistered(nombreScript))
{
   cs.RegisterClientScriptBlock(cstype, nombreScript, sb.ToString(), true);
}*/

if (!cs.IsStartupScriptRegistered(nombreScript))
{
   cs.RegisterStartupScript(cstype, nombreScript, sb.ToString(), true);
}


Lo primero que hacemos es coger el tipo de allá donde estemos (luego veremos el porqué) y le damos un nombre que identifique nuestro script. Posteriormente recogemos el ClientScriptManager desde Page.ClientScript y trabajaremos sobre él.

Creamos nuestro script con un StringBuilder, del que ya se habló en el artículo "El StringBuilder", y ahora viene la parte interesante.

El motivo de haberle dado un nombre identificativo a nuestro script (nombre que debe ser único) es para poder asegurarnos de no sobreescribir dos scripts diferentes, motivo por el que hacemos la comprobación previa "IsxxxRegistered(nombreScript)".

Finalmente, procedemos a registrar el script, y nos encontramos con cuatro parámetros:
1.- El Type de donde estamos y que recogemos previamente con un this.GetType()
2.- El nombre identificativo del script.
3.- El texto propio del script, que habíamos fabricado en el StringBuilder.
4.- Un parámetro booleano en el que decimos si queremos que nuestro script vaya precedido por los típicos tags de inicio y final de javascript "<script language="xxx">" y "</script>". Este última parámetro podemos no ponerlo (por defecto es false).

Y ya está, es así de simple. Ya sabemos cómo insertar código javascript dinámicamente, contruyendo el javascript como nos convenga en cada momento.