0

Tengo una tabla donde selecciono un registro para fines de editarlo si pulso un check, al pulsar el check activo o inactivo los inputs, hasta aquí todo correcto el problema es que cuando inactivo el check todos os Inputs deben limpiarse para que no queden con datos. Tengo el siguiente código que funciona exceptuando limpiar los inputs, he visto varios ejemplos pero ninguno me ha funcionado y agradecería un poco de ayuda ya que tengo un deadline para entrega, lo puedo hacer en C# pero quiero que esta parte sea en el Frontend. a continuación presento el código:

$("[id*=chkSelectDisp]").bind("click", function () {

    //Find and reference the GridView.
    var grid = $(this).closest("table");

    //Find and reference the Header CheckBox.
    //var chkHeader = $("[id*=chkHeader]", grid);

    //If the CheckBox is Checked then enable the TextBoxes in thr Row.
    if (!$(this).is(":checked")) {
        var td = $("td", $(this).closest("tr"));
        td.css({ "background-color": "#FFF" });
        $("input[type=text]", td).attr("disabled", "disabled");
        $("input[type=number]", td).attr("disabled", "disabled");
    } else {
        var td = $("td", $(this).closest("tr"));
        td.css({ "background-color": "#D8EBF2" });
        $("input[type=text]", td).removeAttr("disabled");
        $("input[type=number]", td).removeAttr("disabled");
        $("input[type=text]", td).val("");  <-- aquí el código que puse
    }  
});

Ejemplo

3 respuestas 3

0

Para limpiar el input debes usar el siguiente comando:

document.getElementById("<idDelInput>").value="";

O en su defecto, usando jQuery:

$("#idInput").val("");
0

Creo que tu problema es que tienes varios inputs de tipo text, por lo tanto el código no sabe a cuál de tantos inputs ha de aplicar ese comportamiento. Esto lo puedes solucionar con la funcionalidad each() de jQuery, lo que te permite capturar todos los elementos que tengan ese atributo y aplicarle una retrollamada para cambiar su comportamiento así como se muestra en el siguiente snippet.

$(function() {
  if(! $('input[type=checkbox]').is(':checked')){
    $('input[type=text]').each(function () {
      $(this).attr('disabled', true)
    })
  }
  
  //Capturamos el evento que nos interesa
  $('input[type=checkbox]').click(function () {
    
    //Evalúamos el valor que puede obtener
    if($(this).is(':checked')) {
      //Escogemos a todos los inputs tipo Text
      $('input[type=text]').each(function () {
        //Aplicamos el cambio de atributo para cada each del loop
        $(this).attr('disabled', false)
      })
    } else {
    
      //Aplicamos el sentido contrario y limpiamos los inputs
      $('input[type=text]').each(function () {
        $(this).attr('disabled', true)
        $(this).val('')
      })
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <input type="checkbox">
  <input id="1" type="text" placeholder="Input 1">
  <input id="2" type="text" placeholder="Input 2">
</div>

0

Resuelto

//Enable Disable TextBoxes in a Row when the Row CheckBox is checked.
$("[id*=chkSelectDisp]").bind("click", function () {

    //Find and reference the GridView.
    var grid = $(this).closest("table");

    //If the CheckBox is Checked then enable the TextBoxes in thr Row.
    if (!$(this).is(":checked")) {
        var td = $("td", $(this).closest("tr"));
        td.css({ "background-color": "#FFF" });
        $("input[type=text]", td).attr("disabled", "disabled");
        $("input[type=number]", td).attr("disabled", "disabled");
        td.find('input[type="text"]').val(''); <-- Se resolvió con esta linea
        td.find('input[type="number"]').val(''); <-- Se resolvió con esta linea
    } else {
        var td = $("td", $(this).closest("tr"));
        td.css({ "background-color": "#D8EBF2" });
        $("input[type=text]", td).removeAttr("disabled");
        $("input[type=number]", td).removeAttr("disabled");
        
    }
});

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.