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 vue使用gojs,需求在link中的虚线上添加方向箭头
  • ¥15 CSS通配符清除内外边距为什么可以覆盖默认样式?
  • ¥15 SPSS分类模型实训题步骤
  • ¥15 求解决扩散模型代码问题
  • ¥15 工创大赛太阳能电动车项目零基础要学什么
  • ¥20 limma多组间分析最终p值只有一个
  • ¥15 nopCommerce开发问题
  • ¥15 torch.multiprocessing.spawn.ProcessExitedException: process 1 terminated with signal SIGKILL
  • ¥15 QuartusⅡ15.0编译项目后,output_files中的.jdi、.sld、.sof不更新怎么解决
  • ¥15 pycharm输出和导师的一样,但是标红