0

Hola estoy intentando mostrar una tabla una vez completo dos campos pero antes dicha tabla la oculto con jquery y cuando le doy al boton para que pase por post quiero mostrar dicha tabla y ocultar los campos previos pero no me funciona. Los oculta de inicio, pero al ejecutar el check no muestra la tabla.

Añado tabla

PHP-HTML

echo "<table class='mytable' border-bottom:1px solid #A9A9A9;'>";
 echo "<div id='caja_trabajador_inn'>";
  echo "<div class='caja'>
           <select name='operari_sel' id='operari_sel'>
           <option value='default'>Selecciona un trabajador</option>";
           while($row = $result->fetch_assoc()) {
                     $id_operari=$row['tre_operario'];
                     $selected = ($_POST['operari_sel'] == $id_operari)? 'selected':'';
                     $nom_treballador = $row['tre_nom']." ".$row['tre_cognom'];
                     echo "<option value='$id_operari' ".$selected.">".$row["tre_operario"]." - ".$row["tre_nom"]." ".$row["tre_cognom"]."</option>";
          }
        echo "</select>";
        echo "</div>";
      } else {
      echo "No hay trabajadores o hay un error";
    }
     echo "<div class='fecha_semana_class'>";
        echo "<input type='date' id='fecha_semana' name='fecha_semana' value='$fecha_introducir' required></input>";
      echo "</div>";
  echo "<div class='fecha_semana_class'>";
    echo "<input type='button' id='btn_enviar_datos_treballador' name='btn_enviar_datos_treballador' value='Aceptar'></input>";
    echo "</div>";
echo "<table>";

JQUERY

    function check() {
      var fecha = document.getElementById("fecha_semana").value;
      var op = document.getElementById("operari_sel").value;
    if (fecha == "" || op == "default"){
      layer_show('','','Debes completar todos los campos.','');
      setTimeout(function(){
        layer_close();
      },10000);
      return false;
    }else {
      $("#tabla_pieles_inn").css("display", "block");
      $("#btn_cancelar_datos_treballador").css("display", "block");
      $("#btn_guardar_datos_treballador").css("display", "block");
      $("#caja_trabajador_inn").css("display", "none");
      save();
      return false;
    }
 }

    $( document ).ready(function() {
      $("#tabla_pieles_inn").css("display", "none");
      $("#btn_cancelar_datos_treballador").css("display", "none");
      $("#btn_guardar_datos_treballador").css("display", "none");
      $("#caja_trabajador_inn").css("display", "block");
      $("#btn_enviar_datos_treballador").click(function(){
     check();
     });
});

    function save(){
  section_post("#section-form","../basic/form_pieles_semanal.php",$('form#form_pieles').serialize());
}
4
  • Faltan algunos datos para reproducir tu problema. A saber: Elementos html: #tabla_pieles_inn, #btn_cancelar_datos_treballador, #btn_guardar_datos_treballador, #caja_trabajador_inn, #btn_enviar_datos_treballador (asi veremos como estan dispuestos en tu diseño), y luego las funciones layer_show y save (quizás el problema este alli, solo por si acaso)
    – masterguru
    Commented el 9 feb. 2022 a las 11:59
  • Actualizado @masterguru
    – Luis
    Commented el 9 feb. 2022 a las 12:07
  • ¿Y la tabla donde esta definida? no la veo
    – masterguru
    Commented el 9 feb. 2022 a las 12:27
  • Ya la he insertado @masterguru
    – Luis
    Commented el 9 feb. 2022 a las 12:31

1 respuesta 1

2

La tienes dentro del '<div>' con id='caja_trabajador_inn', y por eso se esconde después de pulsar el botón, pues escondes toda esa capa, incluida la tabla.

Aquí he creado un boceto funcional de como deberia ser para que no ocurriera:

 function check() {
   var fecha = document.getElementById("fecha_semana").value;
   var op = document.getElementById("operari_sel").value;
   if (fecha == "" || op == "default") {
     // layer_show('','','Debes completar todos los campos.','');
     //      setTimeout(function(){
     //        layer_close();
     //      },10000);
     return false;
   } else {
     $("#tabla_pieles_inn").css("display", "block");
     $("#btn_cancelar_datos_treballador").css("display", "block");
     $("#btn_guardar_datos_treballador").css("display", "block");
     $("#caja_trabajador_inn").css("display", "none");
     save();
     return false;
   }
 }

 $(document).ready(function() {
   $("#tabla_pieles_inn").css("display", "none");
   $("#btn_cancelar_datos_treballador").css("display", "none");
   $("#btn_guardar_datos_treballador").css("display", "none");
   $("#caja_trabajador_inn").css("display", "block");
   $("#btn_enviar_datos_treballador").click(function() {
     check();
   });
 });

 function save() {
   // section_post("#section-form","../basic/form_pieles_semanal.php",$('form#form_pieles').serialize());
 }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id='caja_trabajador_inn'>
  <div class='caja'>
    <select name='operari_sel' id='operari_sel'>
      <option value='default'>Selecciona un trabajador</option>
      <option value='1'>operario nom cognom</option>
    </select>
  </div>
  <div class='fecha_semana_class'>
    <input type='date' id='fecha_semana' name='fecha_semana' value='' required>
  </div>
  <div class='fecha_semana_class'>
    <input type='button' id='btn_enviar_datos_treballador' name='btn_enviar_datos_treballador' value='Aceptar'>
  </div>
</div>
<table id="tabla_pieles_inn" border=1>
  <tbody>
    <tr>
      <td>columna tabla pieles</td>
      <td>columna tabla pieles</td>
    </tr>
  </tbody>
</table>

Básicamente la he sacado de ese div, como puedes ver. (He desactivado las llamadas javascript que no eran necesarias o que no podian ejecutarse bien por falta de más código, pero no son cruciales para esta respuesta, donde lo único que debes hacer en tu código real es sacarlo de ese div.)

7
  • El problema es que si lo hago así quitando el save() no me envia los POST, mi intencion es que se envie el formulario al darle al botón de aceptar por operario y fecha que se envie el formulario y se muestre la tabla @masterguru
    – Luis
    Commented el 9 feb. 2022 a las 16:41
  • En la parte final de mi respuesta, después del código, he explicado que he desactivado cosas de tu javsacript para realizar este ejemplo solamente, tu no tienes que hacerlo en el tuyo para nada. Sino no podia ponerte el ejemplo aqui porque daria errores de javascript. Lo único que tienes que hacer en tu caso real es sacar la tabla del div con el id caja_trabajador_inn y nada más.
    – masterguru
    Commented el 9 feb. 2022 a las 17:31
  • No te dediques tan solo a copiar y pegar respuestas, léete las explicaciones, que tambien cuestan un trabajo y son para que aprendas
    – masterguru
    Commented el 9 feb. 2022 a las 17:32
  • Si lo leí y lo entendí, y no copie y pegue, simplemente me gustaria saber cómo podria hacerlo porque con el check() envio el formulario para que se pasen los datos por post, y con lo que tengo es como que reinicio el formulario entonces como que no funciona por si me podias hechar una mano @masterguru
    – Luis
    Commented el 10 feb. 2022 a las 7:22
  • Vale, entiendo, pero eso es otro problema, que no puedo ayudarte si no pones lo que hace la función section_post, la cual pensé que enviabas por ajax, pero tal como me estas contando estas enviandola de alguna forma que hace que se recarge la pagina y se pierda el efecto logrado en esta respuesta... deberias abrir otra pregunta explicando eso y poniendo el código de esa función o directamente intentar que esa funcion sea por ajax o fetch o similar
    – masterguru
    Commented el 10 feb. 2022 a las 7:28

Tu Respuesta

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

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