從選擇下拉列表的數據庫中填充文本區域

我使用vendorid，vendorname，vendoraddress作爲屬性可以使用salesortable表。我無法使用jquery，ajax在textarea中填充數據庫中的數據。從選擇下拉列表的數據庫中填充文本區域

業餘，請幫助。

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Generate</title> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 


    <script type="text/javascript" src="js/jquery.js"></script> 

    <script type="text/javascript">

此工作正常時位置進行選擇會場下拉是

與值自動填充從數據庫

  $(document).ready(function() { 
       $('#locid').change(function(event) { 
        var locs = $("select#locid").val(); 
        $.get('venue', {locationid:locs}, function(response) { 
         var select = $('#venid'); 
         select.find('option').remove(); 
         $.each(response, function(index,value) { 

$('<option>').val(value).text(value).appendTo(select); 
         }); 
        }); 
       }); 
      }); 
    </script> 

    <script type="text/javascript"> 

      $(document).ready(function() { 
       $('#locid').change(function(event) { 
        var locs = $("select#locid").val(); 
        $.get('venue', {locationid:locs}, function(response) { 
         var select = $('#venid'); 
         select.find('option').remove(); 
         $.each(response, function(index,value) { 


    $('<option>').val(value).text(value).appendTo(select); 
          }); 
         }); 
        }); 
       }); 
     </script>

下面的代碼是不工作.on選擇vendorfrom下拉我想要的dat a將自動填充到供應商地址的textarea中。

<script type="text/javascript"> 
     $(document).ready(function() { 
      $('#vendorid').change(function(event) { 
       var adds = $("select#vendorid").val(); 
       $.get('vendor', {vendorid:adds}, function(response) { 
        var select = $('#vendoraddress'); 
        select.find('textarea').remove(); 
        $.each(response, function(index,value) { 
         $('<textarea>').val(value).text(value).appendTo(select); 
        }); 
       }); 
      }); 
     }); 
</script> 

</head> 
<body> 

<nav class="navbar navbar-inverse"> 
    <div class="container-fluid"> 
     <div class="navbar-header" > 
      <a class="navbar-brand" href="index.html"> <img alt="Brand" src="slideshow/img.png" style="height: 40px; display: inline-block; margin-top: -5px"> </a> 
     </div> 
     <ul class="nav navbar-nav" > 
      <li class="active"><a href="index.html">Home</a></li> 
      <li><a href="about.html">Generate POR</a></li> 
      <li><a href="Update\Adminlogin.html">Update POR</a></li> 
      <li><a href="video.html">Help</a></li> 
      <li><a href="contact.html">Contact us</a></li> 

     </ul> 

     <form class="navbar-form navbar-right"> 
      <div class="form-group" id="demo"> 
       <input type="text" class="form-control" placeholder="Search"> 
      </div> 
      <button type="submit" class="btn btn-default">Submit</button> 
     </form> 

     <form class="navbar-form navbar-right"> 
      <div class="form-group" id="txt1" style="color: aliceblue; margin-top: -5px" > 

      </div> 
     </form> 

    </div> 
</nav> 

    <div class="col-md-8 col-md-offset-2"> 
     <div class="row"> 
      <form> 
       <div class="col-sm-12"> 
        <div class="row"> 
         <div class="col-sm-6 form-group"> 
          <label>P O Date</label> 
          <input type="date" class="form-control"> 
         </div> 
         <div class="col-sm-6 form-group"> 
          <label>Category</label> 
          <select class="form-control" > 
           <option>Technology</option> 
           <option>Business</option> 
           <option>Development</option> 
           <option>Process</option> 
          </select> 
         </div> 
        </div> 
       </div> 

       <div class="col-sm-12"> 
        <div class="row"> 
         <div class="col-sm-6 form-group"> 
          <label>Location</label> 
          <select class="form-control" name="locid" id="locid" > 
          <option value="-1"> select </option> 
           <option value="1">Bengaluru</option> 
           <option value="2">Mumbai</option> 
           <option value="3">Pune</option> 
          </select> 
         </div> 
         <div class="col-sm-3 form-group"> 
          <label>Type of training</label> 
          <select class="form-control" > 
           <option>RBI</option> 
           <option>PST</option> 
           <option>Org needs</option> 
          </select> 
         </div> 
         <div class="col-sm-3 form-group"> 
          <label>Venue Details</label> 
          <select class="form-control" name="venid" id="venid" > 
          <option value="-1"> select </option> 
           <option></option> 
          </select> 
         </div> 
        </div> 
       </div> 


       <div class="col-sm-12"> 
        <div class="row"> 
         <div class="col-sm-6 form-group"> 
          <label>Vendor</label> 
          <select class="form-control" name="vendorid" id="vendorid" > 
           <option value="1">Pragati</option> 
           <option value="2">Synerget</option> 
           <option value="3">blah</option> 
          </select> 
         </div> 



       <div class="col-sm-12"> 
        <div class="row"> 
         <div class="col-sm-6 form-group"> 
          <div class="form-group"> 
           <label>Vendor Address</label> 

           <textarea placeholder="Vendor Address Here.." rows="3" class="form-control" id="vendoraddress"></textarea> 
          </div> 
         </div> 

         <div class="col-sm-6 form-group"> 
          <div class="form-group"> 
           <label>Billing Address</label> 
           <br> 
            Billing Address :<br> 
            Quinnox Consultancy Services Ltd.;<br> 
            Unit 170,SDF VI, SEEPZ SEZ,<br> 
            Andheri(East), Mumbai-400096<br> 

          </div> 
         </div> 
        </div> 
       </div> 



         <div class="col-sm-12"> 
          <div class="row"> 
           <div class="table-responsive"> 
            <table class="table table-condensed table-striped table-hover" align="center"> 
             <thead class="thead-inverse"> 
              <tr> 
               <div class="form-group"> 

                <th>Subject</th> 
                <th>Faculty</th> 
                <th colspan="2" align="center">Date</th> 
                <th>Days</th> 
                <th>Batch Size</th> 
                <th>Rate per day</th> 
                <th>Approx Expected value(INR)</th> 
               </div> 
              </tr> 
             </thead> 

             <tbody> 
              <tr> 
               <div class="form-group"> 
                <td><input type="text"/></td> 
                <td><input type="text"/></td> 
                <td><input type="date"/></td> 
                <td><input type="date"/></td> 
                <td><input type="text"/></td> 
                <td><input type="text"/></td> 
                <td><input type="text"/></td> 
                <td><input type="text"/></td> 
               </div> 
              </tr> 
             </tbody> 
            </table> 
           </div> 
          </div> 
         </div> 


         <div class="col-sm-12"> 
          <div class="row"> 

          <tr>TOTAL :</tr> 

          </div> 
         </div> 


         <div class="col-sm-12"> 
          <div class="row"> 
            <h4>Terms and condition : </h4> 
            <p> 
             Payment  : As per discussion<br> 
             Taxes  : As applicable<br> 
             Delivery : As per given schedule<br> 
            </p> 

            <br> 
            <br> 

          </div> 
         </div> 

         <div class="container-fluid"> 

           <p><b>*</b>Travel ans accomodation of outside trainings will be borne by quinnox on actuals</p> 
           <p><b>*</b>Bills to be submitted for the same</p> 
           <br> 

         </div> 

         <div class="col-sm-12"> 
          <div class="row"> 

          <br>       
          For <b>Quinnox Consultancy Services Ltd.</b> 
          <br> 
          </div> 
         </div> 

         <div class="col-sm-12"> 
          <div class="row"> 
          <br> 
           Authorized Signature : 
           <br> 
           <br> 
           <br> 
           <br> 
           <br> 
          </div> 
         </div> 



      </form> 
     </div> 
    </div> 

</body> 
</html>

來源

2016-12-02 Prathameshb7

在控制檯中是否有任何錯誤？ – Santhucool

不，控制檯中沒有錯誤。除了使用數據庫中的值填充textarea之外，所有東西都可以工作。 – Prathameshb7

當您在瀏覽器中直接調用servlet時，servlet'/ vendor？vendorid = 3'的響應是什麼？ –

確保你的servlet即響應/vendor?vendorid=3是正確的JSON。

問題在你的JavaScript：

$.get('vendor', {vendorid:adds}, function(response) { 
    var select = $('#vendoraddress'); 
    select.find('textarea').remove(); 
    $.each(response, function(index,value) { 
     $('<textarea>').val(value).text(value).appendTo(select); 
    }); 
});

使用適當的名稱不是「選擇」。（這是一個複製粘貼錯誤）
- ，而不是var select = $('#vendoraddress');
- 使用var textarea = $('#vendoraddress');
無需取下textarea的子女
- ，而不是select.find('textarea').remove();
- 只是空值textarea.val('');
沒有文字區域內添加文字區域
- ，而不是$('<textarea>').val(value).text(value).appendTo(select);
- 和新值textarea的textarea.val(textarea.val() + value + "\n");

工作代碼：

$.get('vendor', {vendorid:adds}, function(response) { 
    var textarea = $('#vendoraddress'); 
    textarea.val(''); 
    $.each(response, function(index,value) { 
     textarea.val(textarea.val() + value + "\n"); 
    }); 
});

我有一個響應{"1": "Blah 1", "2": "Blah 2"}和內容類型進行了測試"application/json;charset=UTF-8"

爲什麼你得到這個錯誤

因爲代碼是designe的選擇，有選擇標籤兒童：

<select><option></select>

但多行文本，標籤剛纔文本中：

<textarea>text</textarea>

來源

2016-12-02 14:05:19

從選擇下拉列表的數據庫中填充文本區域

回答

相關問題