如何在選中複選框時獲取模態？

ex1.php

<body> 

<form> 

    <label> 
    <input type="checkbox" value="LH" name="name">LH</label> 
    <label> 
    <input type="checkbox" value="LJ" name="name">LJ</label> 
    <label> 
    <input type="checkbox" value="LL" name="name">LL</label> 
    <label> 
    <input type="checkbox" value="FA" name="name">FA</label> 
    <label> 
    <input type="checkbox" value="FB" name="name">FB</label> 
    <label> 
    <input type="checkbox" value="FU" name="name">FU</label> 
</form> 

<!--modal--> 
<div id="myModal" class="modal fade" role="dialog"> 
    <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">Modal Header</h4> 
     </div> 
     <div class="modal-body"> 
     <?php 

     $test = $_POST['test']; 

     $servername = "localhost"; 
     $username = "root"; 
     $password = ""; 


// Create connection 
     $conn = mysqli_connect($servername, $username, $password); 


// Check connection 
     if (!$conn) { 
     die("Connection failed: " . mysqli_connect_error()); 
     } 
     echo "Connected successfully"; 

     mysqli_connect_db("db",$conn); 

     $sql = "SELECT Subcat FROM subcat where CatId=".$test." "; 
     $res = mysqli_query($conn,$sql); 
     while($row = mysqli_fetch_assoc($res)){ 
     echo "<input type='checkbox' name='category[]' value='".$row['Subcat']."'>" 
     .$row['Subcat']; 
     echo "<br>"; 
} 
     ?> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
    </div> 
</div> 


</body>

ex1.js

$document.ready(function(){ 
    $(":checkbox").click(function(){ 
     var value_ck = $(this).val(); 
     $.ajax(
      url:"ex1.php", 
      type:"post", 
      data:{test:value_ck}, 
      success:function(){ 
       $("#myModal").modal(); 




       }); 
    }); 
});

我想在這裏做什麼如下

我有一個表單中的複選框列表。當我點擊一個複選框時，一個模式應該會顯示來自數據庫的相應數據。我是Jquery的初學者。我的代碼無法正常工作。我找到解決方案來解決這個問題。但我無法。

任何人都可以請幫助我嗎？

來源

2016-10-27 casper

使用'$（「INPUT [type = checkbox]」）'而不是'$（「：checkbox」）''。還需要把模式分開的PHP文件。 –

你可以用兩種方式做到這一點:) 1）給模型打開類名複選框（意味着當你點擊一個按鈕時彈出的模型或任何鏈接彈出的模型將打開，所以採取的價值觀，並把複選框）2）在Ajax成功觸發點擊功能 – Shiva

@NikolayKrasnov，爲什麼我應該把模態在單獨的PHP文件？你能解釋一下嗎？ – casper

如果你不熟悉JSON/API的事情，做這樣的：

ex1.php

<body> 

<form> 

    <label> 
    <input type="checkbox" value="LH" name="name">LH</label> 
    <label> 
    <input type="checkbox" value="LJ" name="name">LJ</label> 
    <label> 
    <input type="checkbox" value="LL" name="name">LL</label> 
    <label> 
    <input type="checkbox" value="FA" name="name">FA</label> 
    <label> 
    <input type="checkbox" value="FB" name="name">FB</label> 
    <label> 
    <input type="checkbox" value="FU" name="name">FU</label> 
</form> 

<!--modal--> 
<div id="myModal" class="modal fade" role="dialog"> 
    <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">Modal Header</h4> 
     </div> 
     <div class="modal-body"></div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
    </div> 
</div> 

</body>

modal.php

<?php 

      $test = $_POST['test']; 

      $servername = "localhost"; 
      $username = "root"; 
      $password = ""; 


    // Create connection 
      $conn = mysqli_connect($servername, $username, $password); 


    // Check connection 
      if (!$conn) { 
      die("Connection failed: " . mysqli_connect_error()); 
      } 
      echo "Connected successfully"; 

      mysqli_connect_db("db",$conn); 

      $sql = "SELECT Subcat FROM subcat where CatId=".$test." "; 
      $res = mysqli_query($conn,$sql); 
      while($row = mysqli_fetch_assoc($res)){ 
      echo "<input type='checkbox' name='category[]' value='".$row['Subcat']."'>" 
      .$row['Subcat']; 
      echo "<br>"; 
    } 
?>

ex1.js

$document.ready(function(){ 
    $("INPUT[type=checkbox]").click(function(){ 
     var value_ck = $(this).val(); 
     $.ajax(
      url:"modal.php", 
      type:"post", 
      data:{test:value_ck}, 
      success:function(modalBody){ 
       $("#myModal .modal-body").html(modalBody); 
       $("#myModal").modal(); 
      }); 
    }); 
});

來源

2016-11-03 09:54:38

我會試試這個：D – casper

您可以使用

$('#myModal').modal('show')

要打開一個模型ID myModal和

$('#myModal').modal('hide')

隱藏模式

從POST請求加載數據後，填充值模型在success:function()和使用$('#myModal').modal('show')向用戶顯示模型

來源

2016-10-27 07:26:31 mahethekiller

如何在選中複選框時獲取模態？

回答

相關問題