2016-02-27 19 views
1

我有一個引導模式,充滿了MySQL數據。我面對的問題是,當我點擊按鈕後,檢查複選框數據從未發送到文本框。獲取引導模態值並設置爲textfield

這裏是我的模式:

<div class="modal fade" id="phoneList" tabindex ="-1" role="dialog" aria-labeledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title">Contact List</h4> 
     </div> 
     <div class="modal-body"> 

     <form class="form-horizontal" name="formPbook"/> 
     <table class="table table-striped table-hover table-bordered"> 
     <thead> 
      <tr> 

      <th><input type="checkbox" class="form-control" name="chk_all" id="chk_all" onClick="CheckAll();"/>All</th> 
      <th>Phone Number</th> 
      <th>Name</th> 
      </tr> 
       </thead> 
       <tbody> 
       <tr> 
      <?php 
      include('function.php'); 

      try{ 
      $query = $conn->prepare("SELECT * FROM phonebook"); 
      $query->execute(); 
      } 
      catch(PDOException $e){ 
      echo $e->getMessage(); 
      exit; 
      } 
      while($rs = $query->fetch()) 
      { 
      extract($rs); 
      ?> 
       <td><input type="checkbox" name="select_all[]" value="<?php echo $PhoneNumber;?>" /></td> 
       <td><?php echo $PhoneNumber;?></td> 
       <td><?php echo $Name;?></td> 
        </tr> 
      <?php 
      } 
      ?> 
      </tbody> 
      </table> 
     <div class="form-group"> 
      <div class="col-md-6"> 
      <button type="submit" id="btnselect" name="btnselect" class="btn btn-success pull-right">ACCEPT</button> 
      </div> 
      </div> 
      </div> 
      </div> 
       </div> 
       </form> 

這裏是觸發,並且應該充滿文本框:

<form name="sentMessage" id="contactForm" novalidate autocomplete="off"> 
        <div class="row control-group"> 
         <div class="form-group col-xs-12 floating-label-form-group controls"> 
          <label>Phone Number</label> 
          <input type="tel" class="form-control" placeholder="09**********" id="phoneNumber" required data-validation-required-message="Please enter your phone number."> 
          <p class="help-block text-danger"></p> 
         </div> 
         <button type="button" class="btn btn-success" id="fromContact" name="fromContact" 
         data-target="#phoneList" data-toggle="modal">Select from PhoneBook</button> 
         <button type="button" name="addPhoneBook" id="addPhoneBook" class="btn btn-default" data-toggle="modal" data-target="#addContact">Add Contact</button> 
        </div> 
        <div class="row control-group"> 
         <div class="form-group col-xs-12 floating-label-form-group controls"> 
          <label>Message</label> 
          <textarea rows="10" cols="45" class="form-control" placeholder="Message" id="smsMessage" required data-validation-required-message="Please enter a message."></textarea> 
          <p class="help-block text-danger"></p> 
         </div> 
        </div> 
        <br> 
        <div class="row"> 
         <div class="form-group col-xs-12"> 
          <button type="submit" id="sendMessage" name="sendMessage" class="btn btn-success btn-lg">Send</button> 
         </div> 
         <div id="result"> 
         <img src="img/hourglass.gif" id="loading" style="display:none" class="col-lg"/> 
         </div> 
         <div id="msg"></div> 
        </div> 
       </form> 

我試圖用這個jQuery:

var arr = []; 
$('#inputs input').change(function() { 
if (this.checked) { 
arr.push(this.value); 
} 
else { 
arr.splice(arr.indexOf(this.value), 1); 
} 
$('#target').val(arr + ''); 
}); 

請幫助我,因爲我現在被困在這幾天了...

更改我的JScript代碼到這個

$('formPbook').submit(function(){ 
     var arr[]; 
     $('input:checked[name=select_all[]]').each(function(){ 
      arr.push($(this).val()); 
     }); 
     $('#phonenum').val(arr.join('')); 
      alert($('honenum').val()); 
      return false; 
     }); 

但它仍然沒有工作....

+0

我會嘗試這一個http://stackoverflow.com/questions/14746327/get-the-values-from-the-multiple-checkbox-and-append-it-to-html – SilverRay

+0

我想也是這個教程http://www.formget.com/php-checkbox/,但它也不起作用 – SilverRay

+0

我想我現在正在得到我的代碼的邏輯錯誤。我似乎沒有任何價值通過腳本... – SilverRay

回答

0

,我發現我的解決方案我的實驗和這個是那個的結果。

<!-- Select Phone Numbers from phonebook --> 
<div class="modal fade" id="phoneList" tabindex ="-1" role="dialog" aria-labeledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title">Contact List</h4> 
     </div> 
     <div class="modal-body"> 
     <div id="inputs"> 
     <table class="table table-striped table-hover table-bordered"> 
     <thead> 
      <tr> 
      <th><input type="checkbox" class="form-control" name="chk_all" id="chk_all" onClick="CheckAll();"/>All</th> 
      <th>Phone Number</th> 
      <th>Name</th> 
      </tr> 
       </thead> 
       <tbody> 
       <tr> 
      <?php 
      include('function.php'); 

      try{ 
      $query = $conn->prepare("SELECT * FROM phonebook"); 
      $query->execute(); 
      } 
      catch(PDOException $e){ 
      echo $e->getMessage(); 
      exit; 
      } 
      while($rs = $query->fetch()) 
      { 
      extract($rs); 
      ?> 
       <td><input type="checkbox" name="select_all[]" value="<?php echo $PhoneNumber;?>" /></td> 
       <td><?php echo $PhoneNumber;?></td> 
       <td><?php echo $Name;?></td> 
        </tr> 
      <?php 
      } 
      ?> 
      </tbody> 
      </table> 
      </div> 
      </div> 
       </div> 
       </div> 
       </div> 
        </div> 

JavaScript解決了我的問題。

var arr = []; 
    $('#inputs input').change(function() { 
if (this.checked) { 
arr.push(this.value); 
} 
else { 
arr.splice(arr.indexOf(this.value), 1); 
} 
$('#phoneNumber').val(arr + ''); 
});