none
¿como habilita un boton de asp .net con jquery hasta llenar dos textbox? asp .net c# webform jquery RRS feed

  • Pregunta

  • Hola tengo un proyecto webform y tengo un formulario con etiquetas de <asp: de .net con c#

    y necesito que al llenar dos campos de texto se habilite un <asp:Button. Tengo codigo jquery asi:

    <script>
            $(document).ready(function () {
                $('boton').attr('disabled''disable');
                $('campo1'&&'campo2').keypress(function(){
                    if($(this).val() != ''){
                        $('boton').removeAttr('disabled');
                    }
                });
     
            });
        </script>

    La verdad nose como hacerlo, nose si la sintaxis este bien o no... no he usado jquery nunca

    Gracias

    Saludos

    martes, 6 de marzo de 2018 19:01

Respuestas

Todas las respuestas

  • hola

    que id asignas a los buttons de asp.net ? poner boton campo1, campo2 eso no es ningun selector de jquery

    deberias usar

    $('#<%=boton.ClientID%>').attr('disabled', 'disable');

    button seria el id del control asp.net

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    martes, 6 de marzo de 2018 19:39
  • Le anda cerca pero le falta un poco.

    $(function()
    {
        var campos = $('#<%=txtCampo1.ClientID%>, #<%=txtCampo2.ClientID%>');
        var boton = $('#<%=btnBoton.ClientID%>');
        campos.keypress(function() {
            bool lleno = true;
            campos.each(function() {
                lleno = lleno && $(this).val();
            });
            boton.prop('disabled', !lleno);
        });
    });

    No probé pero espero que le funcione bien.


    Jose R. MCP
    Code Samples

    martes, 6 de marzo de 2018 23:21
    Moderador
  • Le anda cerca pero le falta un poco.

    $(function()
    {
        var campos = $('#<%=txtCampo1.ClientID%>, #<%=txtCampo2.ClientID%>');
        var boton = $('#<%=btnBoton.ClientID%>');
        campos.keypress(function() {
            bool lleno = true;
            campos.each(function() {
                lleno = lleno && $(this).val();
            });
            boton.prop('disabled', !lleno);
        });
    });

    No probé pero espero que le funcione bien.


    Jose R. MCP
    Code Samples

    Hola muchas gracias por responder

    bool lleno = true; cuando declaro esto me aparece en rojo y un mensajito que dice:

    "se esperaba ;"

    Lo he copiado tal cual..

    saludos


    miércoles, 7 de marzo de 2018 3:37
  • Jeje, perdón, se me salió el .net ahí.  var lleno = true;.

    Jose R. MCP
    Code Samples

    miércoles, 7 de marzo de 2018 5:46
    Moderador
  • Jeje, perdón, se me salió el .net ahí.  var lleno = true;.

    Jose R. MCP
    Code Samples

    Gracias por responder nuevamente, ahora me marca el error, pero no me funciona... sera que tengo que agregar algo a mis <asp:Textbox y al <asp:Button?

    Estoy muy perdida en esto.

    Gracias

    miércoles, 7 de marzo de 2018 15:30
  • Muestre su código JavaScript tal y como lo tiene ahora y díganos si este script está en un .aspx o si está en otra parte.

    Jose R. MCP
    Code Samples

    miércoles, 7 de marzo de 2018 16:22
    Moderador
  • Muestre su código JavaScript tal y como lo tiene ahora y díganos si este script está en un .aspx o si está en otra parte.

    Jose R. MCP
    Code Samples

    1. Lo tengo en el aspx
    2. <asp:textboxTextMode="Password"id="clave1" .... />
    3. <asp:textboxTextMode="Password"id="clave2" ... />

      <asp:Buttontype="button"runat="server"text="CONFIRMAR"id="Mnip"onclick="Mnip_Click"/>     

    <script>
    $(function()
    {
        var campos = $('#<%=clave1.ClientID%>, #<%=clave2.ClientID%>');
        var boton = $('#<%=Mnip.ClientID%>');
        campos.keypress(function() {
            var lleno = true;
            campos.each(function() {
                lleno = lleno && $(this).val();
            });
            boton.prop('disabled', !lleno);
        });
    });
    </script>

        
    miércoles, 7 de marzo de 2018 17:07
  • Ok, parece que && no me funciona como esperaba así que tuve que hacer explícita la comparación del valor.

    $(function()
     {
      var campos = $('#pwd1, #pwd2');
      var boton = $('#btn');
      campos.on('input', function() {
        var lleno = true;
        campos.each(function() {
          var valor = $(this).val();
          lleno = lleno && valor !== undefined && valor !== '';
        });
        boton.prop('disabled', !lleno);
      });
    });

    Solamente cambie los ID's del código de arriba por los reemplazos que ha venido usando.  Es que este código lo probé en JSBin, y pues ahí no tenía la necesidad pues es puro HTML.

    Ah, y nótese el cambio de evento.  KeyPress no sirve porque se da antes de que val() adquiera algún valor en el caso de que sea la primera tecla.


    Jose R. MCP
    Code Samples


    miércoles, 7 de marzo de 2018 18:02
    Moderador
  • Ok, parece que && no me funciona como esperaba así que tuve que hacer explícita la comparación del valor.

    $(function()
     {
      var campos = $('#pwd1, #pwd2');
      var boton = $('#btn');
      campos.on('input', function() {
        var lleno = true;
        campos.each(function() {
          var valor = $(this).val();
          lleno = lleno && valor !== undefined && valor !== '';
        });
        boton.prop('disabled', !lleno);
      });
    });

    Solamente cambie los ID's del código de arriba por los reemplazos que ha venido usando.  Es que este código lo probé en JSBin, y pues ahí no tenía la necesidad pues es puro HTML.


    Jose R. MCP
    Code Samples

    En esta parte 

     campos.on('input', function() {<---- el input se refiere al boton, o todos los campos input?
    miércoles, 7 de marzo de 2018 18:05
  • Ahí input se refiere al evento llamado input.

    Jose R. MCP
    Code Samples

    miércoles, 7 de marzo de 2018 18:18
    Moderador
  • Ahí input se refiere al evento llamado input.

    Jose R. MCP
    Code Samples

    y ese evento como lo declaro?

    O asi como esta el codigo lo pongo y ya?

    1. Lo tengo en el aspx
    2. <asp:textboxTextMode="Password"id="clave1" .... />
    3. <asp:textboxTextMode="Password"id="clave2" ... />

      <asp:Buttontype="button"runat="server"text="CONFIRMAR"id="Mnip"onclick="Mnip_Click"/>     

    <script>

    $(function()
     {
      var campos = $('#clave1, #clave2');
      var boton = $('#Mnip');
      campos.on('input', function() {
        var lleno = true;
        campos.each(function() {
          var valor = $(this).val();
          lleno = lleno && valor !== undefined && valor !== '';
        });
        boton.prop('disabled', !lleno);
      });
    });
    </script>

    miércoles, 7 de marzo de 2018 18:55
  • Así como le di el script, funciona.

    Pero como usted usa ASP.net webforms, muchas veces el ID que vemos en la página aspx no es el ID que resulta en el HTML.  Por eso no usamos el ID directamente.  En vez de '#clave1, #clave2' (que tal vez sí sirva pero tal vez no), usamos '#<%=clave1.ClientID %>, #<%=clave2.ClientID %>'.  Misma cosa para el ID del botón.


    Jose R. MCP
    Code Samples

    miércoles, 7 de marzo de 2018 19:11
    Moderador