none
Características jquery se desactivan cuando oculto algún control RRS feed

  • Pregunta

  • Saludos.  Tengo una página ASP.NET con controles como estos:

    <asp:TextBox ID="TextBox1" runat="server" Width="143px" AutoPostBack="true" OnTextChanged="expediente" Enabled="False"></asp:TextBox>

    <asp:Button ID="Button4" runat="server" Text="Agregar" />

    <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>

    Utilizando jquery, hago lo siguiente:

    <script type="text/javascript">
           $(document).ready(function () {
               $("#<%=TextBox1.ClientID%>").mask('###-##');
           })
     </script>

    $(document).ready(function () {
            $("#<%=Button4.ClientID%>").jqxButton();

    });

    <script>
          $(function () {
                 $("#<%=TextBox4.ClientID%>").datepicker({ dateFormat: 'dd-mm-yy' });
                 $("#<%=TextBox6.ClientID%>").datepicker({ dateFormat: 'dd-mm-yy' });
          });
     </script> 

    Hasta aquí todo bien, los controles se comportan como quiero.  El problema surge cuando desde otro control realizó algún procedimiento donde oculto algún control, por ejemplo un botón.  Si le pongo la propiedad visible en false a algún botón, el comportamiento de los controles se pierde y quedan como controles normales.

    ¿A qué se puede deber esto?  ¿Hay alguna forma de ocultar los controles con el mismo jquery?

    Gracias!!


    Carlos Mora, foro MSDN

    miércoles, 11 de mayo de 2016 20:40

Respuestas

  • Hola.  Como ya se dio cuenta, usar Visible para ocultar controles le produce errores.  ¿Por qué?  Porque un control con Visible = false nunca se incluye en el HTML final.  Es como si nunca hubiera existido.  Entonces viene Javascript y trata de obtener dichos controles inexistentes y falla, probablemente devolviendo null o undefined, y luego uno no puede llamar métodos sobre null o undefined, lo que hace que todo el javascript falle y por lo tanto que toda la funcionalidad de los demás controles desaparezca porque hubo un javascript runtime error.  Seguramente lo puede ver en la consola.

    En vez de Visible = false, oculte con una clase CSS en la propiedad CssClass que tenga "display: none;".

    En cuanto a situaciones raras después del postback:  Recuerde que lo que setee via Javascript no persistirá.  Si ocultó un control via JS, en el postback vendrá como originalmente estaba a menos que tenga código para cambiar esto.  El postback solamente recuerda los valores que estén en el ViewState, y nada de lo que hace Javascript afecta el ViewState.


    Jose R. MCP
    Code Samples

    • Marcado como respuesta Liyos martes, 17 de mayo de 2016 12:52
    viernes, 13 de mayo de 2016 13:49
    Moderador

Todas las respuestas

  • hola

    >>El problema surge cuando desde otro control realizó algún procedimiento donde oculto algún control, por ejemplo un botón

    pero esto lo realzias desde codigo .net en el servidor ?

     >>Si le pongo la propiedad visible en false a algún botón, el comportamiento de los controles se pierde y quedan como controles normales.

    a que llamas controles normales ?

    por lo que entiendo no estaria aplicando jqxButton() pero si esta oculto no veo como puedes visualizar en el browser, a donde apunto es que no importa si aplica o no la libreria jquery en ese boton si lo ocultas desde codigo en el servidor

    >>¿Hay alguna forma de ocultar los controles con el mismo jquery?

    si puedes usar

     $("#<%=Button4.ClientID%>").hide(); 

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 12 de mayo de 2016 11:21
  • Como siempre atento Leandro.

    Y como siempre no me expliqué bien jajajaj.

    Lo que quiero decir es que si tengo 3 controles, cuando oculto el primero, los otros dos se comportan como si no se les aplicara el jquery.  Es decir, si el segundo control es un Textbox al que le aplico datepicker, al entrar funciona perfecto, pero al ocultar el primer control, este segundo ya no le funciona el datepicker y queda como un Textbox normal.

    Voy a probar con esa propiedad hide a ver cómo me va y cierro la consulta.


    Carlos Mora, foro MSDN

    jueves, 12 de mayo de 2016 13:00
  • Ok, funciona perfecto.  Ahora tengo varios controles (botones) que debo ocultar o mostrar dependiendo de algunas circunstancias. Al entrar a la página los oculto todos, luego los voy manejando así:

    ScriptManager.RegisterStartupScript(Me, GetType(Page), "jsKeys8", "javascript:mostrarBoton3();", True)
    ScriptManager.RegisterStartupScript(Me, GetType(Page), "jsKeys1", "javascript:ocultaBoton1();", True)

    Esto lo vi en otro post tuyo.

    Lo curioso es que como se ve en el ejemplo, sólo muestro el Botón3 y oculto el Botón1 (son hide y show), los botones 2, 4, 5 y 6 deberían permanecer ocultos. Al recargar la página el botón1 se muestra perfectamente, pero igual se muestran todos!!!!.

    No sé si tendrá que ver con el postback, pues en código ni los menciono!!!

    Gracias!!


    Carlos Mora, foro MSDN

    jueves, 12 de mayo de 2016 20:33
  • hola

    >>Al entrar a la página los oculto todos, luego los voy manejando así:

    pero eso es codigo del lado del servidor, requires de un post para que ejecute

    >>los otros dos se comportan como si no se les aplicara el jquery

    estas usando el control UpdatePanel ? porque puede darse un evento al servidor de esa seccion de codigo lo cual quite lo aplicado con jquery

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 12 de mayo de 2016 21:15
  • >>pero eso es codigo del lado del servidor, requires de un post para que ejecute

    Un postback?   voy a probar.

    >>estas usando el control UpdatePanel ?

    No, no estoy usando ese control

    Vamos a probar a ver que sale.

    Gracias


    Carlos Mora, foro MSDN

    viernes, 13 de mayo de 2016 13:01
  • Para ver si lo puedo aclarar más.  Tengo un textbox que al escribir algún texto necesito que lo busque en una BD, entonces tengo esto:

    <asp:TextBox ID="TextBox8" runat="server" AutoPostBack="true" OnTextChanged="buscar"></asp:TextBox>

    En la página aspx.vb tengo:

                

    Protected Sub buscar(sender As Object, e As EventArgs)
            Label1.Text = String.Empty
            Dim p As String
            Dim Canal As SqlConnection
            Dim producto As String
            producto = TextBox8.Text

            Canal = New SqlConnection("la conexion")
            p = "Select * FROM PRO_Productos WHERE PRO_Nombre_Producto LIKE '%'+@producto+'%'"

            Dim midataset As New DataSet()
            Dim comando As New SqlDataAdapter(p, Canal)
            comando.SelectCommand.Parameters.Add(New SqlParameter("@producto", SqlDbType.NVarChar))
            comando.SelectCommand.Parameters("@producto").Value = producto
            comando.Fill(midataset, "abuscar")

            If midataset.Tables("abuscar").Rows.Count > 0 Then
                GridView2.Visible = True
                GridView2.DataBind()
                Label7.Visible = True
                RadioButtonList4.Visible = True
                'Button3.Visible = True
                'Button1.Visible = False
                ScriptManager.RegisterStartupScript(Me, GetType(Page), "jsKeys8", "javascript:mostrarBoton3();", True)
                ScriptManager.RegisterStartupScript(Me, GetType(Page), "jsKeys1", "javascript:ocultaBoton1();", True)
                TextBox9.Text = midataset.Tables(0).Rows(0)("PRO_Codigo").ToString
                ScriptManager.RegisterStartupScript(Me, GetType(Page), "alerta", "alert('Hay productos con nombres similares!! Verifique los datos en el cuadro que se ve abajo');", True)

            Else
                Label1.Text = String.Empty
                GridView2.Visible = False
                TextBox1.Enabled = True
                TextBox2.Enabled = True
                DropDownList2.Enabled = True
                DropDownList6.Enabled = True
                DropDownList4.Enabled = True
                DropDownList3.Enabled = True
                'Button2.Visible = True
                'Button1.Visible = True
                'Button3.Visible = False
                ScriptManager.RegisterStartupScript(Me, GetType(Page), "jsKeys7", "javascript:mostrarBoton1();", True)
                ScriptManager.RegisterStartupScript(Me, GetType(Page), "jsKeys3", "javascript:ocultaBoton3();", True)
            End If
            TextBox1.Focus()
     End Sub

    Como podés ver, estaba tratando de ocultar y mostrar los botones con la propiedad Visible, pero ahí me estaba dando problemas pues no aplicaba jquery a otros controles.  Así sí aplica pero no oculta y muestra como está en el código.

    ¿Es aquí donde decís que requiero un postback?  ¿No lo hace al llamar al procedimiento "buscar"?

    Mil gracias Leandro


    Carlos Mora, foro MSDN

    viernes, 13 de mayo de 2016 13:39
  • Hola.  Como ya se dio cuenta, usar Visible para ocultar controles le produce errores.  ¿Por qué?  Porque un control con Visible = false nunca se incluye en el HTML final.  Es como si nunca hubiera existido.  Entonces viene Javascript y trata de obtener dichos controles inexistentes y falla, probablemente devolviendo null o undefined, y luego uno no puede llamar métodos sobre null o undefined, lo que hace que todo el javascript falle y por lo tanto que toda la funcionalidad de los demás controles desaparezca porque hubo un javascript runtime error.  Seguramente lo puede ver en la consola.

    En vez de Visible = false, oculte con una clase CSS en la propiedad CssClass que tenga "display: none;".

    En cuanto a situaciones raras después del postback:  Recuerde que lo que setee via Javascript no persistirá.  Si ocultó un control via JS, en el postback vendrá como originalmente estaba a menos que tenga código para cambiar esto.  El postback solamente recuerda los valores que estén en el ViewState, y nada de lo que hace Javascript afecta el ViewState.


    Jose R. MCP
    Code Samples

    • Marcado como respuesta Liyos martes, 17 de mayo de 2016 12:52
    viernes, 13 de mayo de 2016 13:49
    Moderador
  • Hola Jose.  No sabía lo que pasa con el postback y los controles manipulados con JS. Con razón luego de ocultarlos al hacer un postback vuelven a aparecer todos!!!! Voy a tener que ir por otra vía entonces pues se me complica.

    Gracias Jose.


    Carlos Mora, foro MSDN

    viernes, 13 de mayo de 2016 14:23