Tengo una página ASP.NET con un botón asp: que no está visible. No puedo convertirlo en visible con JavaScript porque no se representa en la página.Cambiar la visibilidad de la etiqueta ASP.NET con JavaScript
¿Qué puedo hacer para resolver esto?
Tengo una página ASP.NET con un botón asp: que no está visible. No puedo convertirlo en visible con JavaScript porque no se representa en la página.Cambiar la visibilidad de la etiqueta ASP.NET con JavaScript
¿Qué puedo hacer para resolver esto?
Si necesita manipularlo en el lado del cliente, no puede usar la propiedad Visible en el lado del servidor. En su lugar, configure su estilo de visualización CSS en "ninguno". Por ejemplo:
<asp:Label runat="server" id="Label1" style="display: none;" />
A continuación, puede hacer que sea visible en el lado del cliente con:
document.getElementById('Label1').style.display = 'inherit';
Se podría hacer más oculto de nuevo con:
document.getElementById('Label1').style.display = 'none';
Tenga en cuenta que hay puede haber problemas con ClientID siendo más complejo que "Label1" en la práctica. Deberá usar ClientID con getElementById, no la ID del lado del servidor, si difieren.
Si espera hasta que se cargue la página, y luego configura la pantalla del botón en ninguna, eso debería funcionar. Entonces puedes hacer que sea visible en un momento posterior.
Asegúrese de que la propiedad Visible esté establecida en verdadero o que el control no se muestre en la página. Entonces puedes usar script para manipularlo.
Pruebe esto.
<asp:Button id="myButton" runat="server" style="display:none" Text="Click Me" />
<script type="text/javascript">
function ShowButton() {
var buttonID = '<%= myButton.ClientID %>';
var button = document.getElementById(buttonID);
if(button) { button.style.display = 'inherit'; }
}
</script>
No utilice el código del lado del servidor para hacer esto porque eso requeriría una devolución de datos. En lugar de usar Visibility = "false", puede establecer una propiedad de CSS que oculte el botón. Luego, en javascript, cambia esa propiedad cuando quieras volver a mostrar el botón.
ClientID se utiliza porque puede ser diferente de la ID del servidor si el botón está dentro de un control de nombre de contenedor. Estos incluyen paneles de varios tipos.
Siguiendo con lo que dijo Dave Ward:
diseño de página/Control de
<asp:Label runat="server" ID="Label1" Style="display: none;" />
<asp:Button runat="server" ID="Button1" />
Código detrás
En algún lugar de la sección de carga:
Label label1 = (Label)FindControl("Label1");
((Label)FindControl("Button1")).OnClientClick = "ToggleVisibility('" + label1.ClientID + "')";
archivo
function ToggleVisibility(elementID)
{
var element = document.getElementByID(elementID);
if (element.style.display = 'none')
{
element.style.display = 'inherit';
}
else
{
element.style.display = 'none';
}
}
Por supuesto Javascript, si usted no quiere cambiar, pero sólo para mostrar el botón/etiqueta y luego ajustar el método de Javascript en consecuencia.
El punto importante aquí es que debe enviar la información sobre el control ClientID
que desea manipular en el lado del cliente al archivo javascript estableciendo variables globales o mediante un parámetro de función como en mi ejemplo.
Necesita ser cuidadoso de XSS al hacer cosas como esta:
document.getElementById('<%= Label1.ClientID %>').style.display
lo más probable es que nadie será capaz de manipular el ClientID de Label1 en este caso, pero sólo para estar en el lado seguro es posible que desee pasar su valor a través de uno de los métodos AntiXss library's:
document.getElementById('<%= AntiXss.JavaScriptEncode(Label1.ClientID) %>').style.display
Ésta es la manera más fácil que he encontrado:
BtnUpload.Style.Add("display", "none");
FileUploader.Style.Add("display", "none");
BtnAccept.Style.Add("display", "inherit");
BtnClear.Style.Add("display", "inherit");
Tengo lo opuesto en el Else, por lo que se encarga de mostrarlos también. Esto puede ir en la carga de la página o en un método para actualizar los controles en la página.