简体   繁体   中英

Form in the bootstrap modal not submitting

I have a page that output data in html format like this with a form in it used to update the date.

registration.php

      while($row = mysqli_fetch_array($run))  
     {  
       $output .= '   
       <tr>  
       <td width="70%">'. $row["fullname"].' </td>
      **<form action="add_date.php?id='. $row["client_id"].'" method="post">**
      <td width="70%"> 
      <input type="text" value="'. $row["pass_date"].'" id="add_date" 
      name="add_date"/>       
      </td>
      <td><input type="submit" id="'. $row["client_id"].'" name="submit" 
      class="btn btn-primary btn-xs"/></td>
      </form>
      </tr> ';

  }  

And there is another page which shows this data in the modal.

index.php

                   <!--client modal -->
            <div id="dataModal" class="modal fade paidclient">  
  <div class="modal-dialog">  
       <div class="modal-content">  
            <div class="modal-header">  
         <button type="button" class="close" data-
    dismiss="modal">&times;</button>  
                 <h4 class="modal-title"></h4>  
            </div>  
            <div class="modal-body paidclient" id="employee_detail">  
            </div>  
            <div class="modal-footer">  
          <button type="button" class="btn btn-default" data-
         dismiss="modal">Close</button>  
            </div>  
       </div>  
      </div>  
      </div>  

              $(document).on('click', '.today_registration', function(){  
            $.ajax({  
                 url:"registration.php",  
                 method:"POST",  
                 success:function(data){  
                      $('#employee_detail').html(data);  
                      $('#dataModal').modal('show');
                      $('.modal-title').text("Today Registration");  

                 }  
            });  

  }); 



            <!-- client modal-->

The main issue is the form is not submitting, doing nothing when pressing submit button

You just have to add button

while($row = mysqli_fetch_array($run))  
         {  
           $output .= '   
           <tr>  
           <td width="70%">'. $row["fullname"].' </td>
          <!-- add id in form -->
          **<form id="addform" action="add_date.php?id='. $row["client_id"].'" method="post">**
          <td width="70%"> 
          <input type="text" value="'. $row["pass_date"].'" id="add_date" 
          name="add_date"/>       
          </td>
          <td><input type="submit" id="'. $row["client_id"].'" name="submit" 
          class="btn btn-primary btn-xs"/></td>
          </form>
          </tr> ';

      }  

        <!--client modal -->
                    <div id="dataModal" class="modal fade paidclient">  
          <div class="modal-dialog">  
               <div class="modal-content">  
                    <div class="modal-header">  
                 <button type="button" class="close" data-
            dismiss="modal">&times;</button>  
                         <h4 class="modal-title"></h4>  
                    </div>  
                    <div class="modal-body paidclient" id="employee_detail">  
                    </div>  
                    <div class="modal-footer"> 
                  <!-- add this button -->
                  <button type="button" id="btnform" class="btn btn-primary" >Submit</button>  
                  <!-- add this button -->
                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
                    </div>  
               </div> 
              </div>  
              </div> 
<!-- add this  -->
$(document).on('click', '#btnform', function(){  
 $('#addform').submit();
}); 
<!-- add this  -->


 $(document).on('click', '.today_registration', function(){  
                $.ajax({  
                     url:"registration.php",  
                     method:"POST",  
                     success:function(data){  
                          $('#employee_detail').html(data);  
                          $('#dataModal').modal('show');
                          $('.modal-title').text("Today Registration");  

                     }  
                });  

      }); 

     <!-- client modal-->

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM