dsgoj7457 2016-09-18 12:29
浏览 85
已采纳

Bootstrap Modal提交表单

I've been searching all over and trying different combinations. I will try to explain exactly what I need. I have a table populated with SQL data, last column is an Edit button to open a bootstrap modal. I've been able to populate the table and create the edit button to pass the row id into the modal for the query on the modal populate all inputs with actual data on DB. Everything is working. But now I can't even make a POST on the form, I hit the button and nothing happens.

<?php 
require 'style/header.php';
require 'core/db_connect.php';
?><div class="main">
            <div class="row">
                <table class= "table table-striped table-bordered table-hover">
                    <thead>
                        <tr>
                            <th colspan="1" rowspan="1" style="width: 180px;" tabindex="0">BI/CC</th>
                            <th colspan="1" rowspan="1" style="width: 220px;" tabindex="0">Name</th>
                            <th colspan="1" rowspan="1" style="width: 288px;" tabindex="0">Supplier Number</th>
                            <th colspan="1" rowspan="1" style="width: 40px;" tabindex="0">Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                    <?php
                    $query = "SELECT bicc, name, supplier_number ";
                    $query .= "FROM ext_work_risk ";
                    $result = sqlsrv_query($dbhandle, $query);
                    $i=0;
                    while($fetch = sqlsrv_fetch_array($result))
                    {
                        if($i%2==0) $class = 'even'; else $class = 'odd';                           
                        echo'<tr class="'.$class.'">
                            <td>'.$fetch['bicc'].'</td>
                            <td>'.$fetch['name'].'</td>
                            <td>'.$fetch['supplier_number'].'</td>                                <td><a class="modalButton" data-bicc="'.$fetch['bicc'].'"><button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target="#modal_edit" data-container="body">Edit</button></a></td>
                            </tr>';                         
                        }
                        ?>
                        </tbody>
                    </table>
        </div>
</div>
<div id="modal_edit" class="modal fade" style="font-weight: normal;">
    <div class="modal-dialog">
          <div class="modal-content">

          </div>
    </div>
</div>
<?php require 'style/footer.php' ?>

<!-- Script Part -->
<script type="text/javascript">
    $('.modalButton').click(function(){
        var bicc = $(this).attr('data-bicc');
        $.ajax({url:"modal/ajax_ext_risk_modal_edit.php?bicc="+bicc,cache:false,success:function(result){
            $(".modal-content").html(result);
        }});
    });
</script>

Now the "modal/ajax_ext_risk_modal_edit.php" file:

<?php
$bicc = $_GET['bicc'];
//DB connect settins
require '../core/db_connect.php';
$query = "SELECT * ";
$query .= "FROM ext_work_risk WHERE bicc='$bicc'";
$result = sqlsrv_query($dbhandle, $query);
$fetch = sqlsrv_fetch_array($result);
?>
  <!-- Modal -->
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Edit Co-Worker</h4>
        </div>
        <div class="modal-body">
        <p>To edit just type the new date in the format <b>YYYY/MM/DD</b> and click save.
          <form class="form-horizontal" role="form" method="POST" action="../core/process_ext_risk_modal.php">
              <div class="form-group">
                <label class="control-label col-sm-4">BI/CC:</label>
                <div class="col-sm-7">
                  <input class="form-control" id="bicc" name="bicc" readonly="readonly" value="<?php echo $fetch['bicc']; ?>">
                </div>
              </div>
              <div class="form-group">
                <label class="control-label col-sm-4">Name:</label>
                <div class="col-sm-7">
                  <input class="form-control" id="name" readonly="readonly" value="<?php echo $fetch['name']; ?>">
                </div>
              </div>
              <div class="form-group">
                <label class="control-label col-sm-4">Sup. Number:</label>
                <div class="col-sm-7">
                  <input class="form-control" id="supplier_number" readonly="readonly" value="<?php echo $fetch['supplier_number']; ?>">
                </div>
              </div> 
          <div class="form-group">
            <label class="control-label col-sm-4">LOTO:</label>
            <div class="col-sm-7">
              <input class="form-control" id="loto" name="loto" <?php $loto = $fetch['loto']->format('Y/m/d'); if ($loto == "2000/01/01") {echo "placeholder='Please insert date'";} else {echo "value='$loto'";} ?>>
            </div>
          </div>
              <div class="form-group">
                <label class="control-label col-sm-4">Lift Platform:</label>
                <div class="col-sm-7">
                  <input class="form-control" id="lift_platform" <?php $lift_platform = $fetch['lift_platform']->format('Y/m/d'); if ($lift_platform == "2000/01/01") {echo "placeholder='Please insert date'";} else {echo "value='$lift_platform'";} ?>>
                </div>
              </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-default btn-success" type="submit" name="submit" value="Submit">Save</button>
        </div>

When I hit Save button nothing happens. Here is the ../core/process_ext_risk_modal.php file:

<?php
include("db_connect.php");
if(isset($_POST["save"])) {
  $id = $_POST['bicc'];
  $data = $_POST['loto'];
  if(sqlsrv_query($dbhandle, "update ext_work_risk set loto='$data' where bicc='$id'"))
  echo 'success';
}
?>

This last file is just for testing of course I will be Updating much more data on the form submit.

Thank you

  • 写回答

1条回答 默认 最新

  • dongxia2068 2016-09-18 13:13
    关注

    I just found the problem thanks to Fred -ii tips:

    So here is the previous code block:

      </form>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      <button type="button" class="btn btn-default btn-success" type="submit" name="submit" value="Submit">Save</button>
    </div>
    

    And now the corrected one:

        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button class="btn btn-default btn-success" type="submit" name="submit" value="Submit">Save</button>
        </div>
     </form>
    

    Also changing if(isset($_POST["save"])) to if(isset($_POST["submit"])). Main problem being having submit outside form and two types defined on the same button.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 c语言怎么用printf(“\b \b”)与getch()实现黑框里写入与删除?
  • ¥20 怎么用dlib库的算法识别小麦病虫害
  • ¥15 华为ensp模拟器中S5700交换机在配置过程中老是反复重启
  • ¥15 java写代码遇到问题,求帮助
  • ¥15 uniapp uview http 如何实现统一的请求异常信息提示?
  • ¥15 有了解d3和topogram.js库的吗?有偿请教
  • ¥100 任意维数的K均值聚类
  • ¥15 stamps做sbas-insar,时序沉降图怎么画
  • ¥15 买了个传感器,根据商家发的代码和步骤使用但是代码报错了不会改,有没有人可以看看
  • ¥15 关于#Java#的问题,如何解决?