how get value using jQuery?

i have two form and a validate button, i want form1 to display and form2 to hide, and when i click on validate button i want form1 to hide and form2 to display and for the date i want to display date now. also the values of form1 display in form2 each by its place.

also the values of form1 display in form2 each by its place.

form1

  <script src="https://code.jquery.com/jquery-3.3.1.js"></script>

  <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

  <!-------------------------------->
  <div id="form1">
          <label for="titre">DAY pointage</label>
          <input type="date" name="datep" class="form-control">
          <br>
              <label for="titre">Chantier</label>
              <select class="form-control" id="chantier_id">
                <option selected disabled>Select Location</option>
                <option value="1">azilal</option>
                <option value="2">asfalou</option>
                <option value="3">ihjamn</option>
              </select>
          <br>
             <label for="titre">Ouvrage</label>
              <select class="form-control" id="ouvrage_id">
                        <option value="0" selected disabled>- Select -</option>
                        <option value="1">assinissement</option>
                        <option value="2">installation</option>
              </select>
          <br>
             <label for="titre">default nbre day</label>
             <input type="text" name="nbre" class="form-control" value="1">
          <br>
            <button class="btn btn-theme " type="submit" >valider</button>
          <br>
          <br>

</div> 

form2

<div id="form2">

              <br>
              <div>Day : dayPointage , Chantier : chantierSelected , Ouvrage : ouvrageSelected</div>
              <table id="example" class="table table-striped table-bordered" style="width:100%">
                 <thead>
                  <tr>
                    <th><input type="checkbox" id="check_all"></th>
                    <th>nom prenom</th>
                    <th>cin</th>
                    <th>matricule</th>
                    <th>default nbre day</th>
                  </tr>
                 </thead>
                <tbody>
                  <tr id="1">
                    <td><input type="checkbox" class="checkbox" name="customer_id[]" value="1" /></td>
                    <td>MARZOUK NAJIB</td>
                    <td>Pa130191</td>
                    <td>2925019599</td>
                    <td value="1"><input type="text" name="nbre" class="form-control" value="default nbre day"></td>
                  </tr>
                   <tr id="2">
                    <td><input type="checkbox" class="checkbox" name="customer_id[]" value="2" /></td>
                    <td>achraf bourki</td>
                    <td>pa5000</td>
                    <td>202020</td>
                    <td value="2"><input type="text" name="nbre" class="form-control" value="default nbre day"></td>
                  </tr>
                </tbody>
              </table>
</div>

jQuery $(document).ready(function () {

    $('#check_all').on('click', function(e) {
     if($(this).is(':checked',true))  
     {
        $(".checkbox").prop('checked', true);  
     } else {  
        $(".checkbox").prop('checked',false);  
     }  
    });
     $('.checkbox').on('click',function(){
        if($('.checkbox:checked').length == $('.checkbox').length){
            $('#check_all').prop('checked',true);
        }else{
            $('#check_all').prop('checked',false);
        }
     });
     });

1 answer

  • answered 2020-02-16 15:25 Yosef Tukachinsky

    $('#form2 [name=nbre]').val($('#form1 [name=nbre]').val())

    And same for each input