如何根据下拉选择填充文本框?

时间:2018-08-27 05:37:30

标签: javascript php jquery ajax codeigniter

我必须根据单个表中的下拉值填充文本框。 这是我的桌子: TableStructure table content

在这里,当我从下拉列表中选择类别1时,我希望文本框值为400(价格),对于类别2,它应该填充500,依此类推。...我已经从数据库中填充了下拉值,请帮助我带有文本框值。

控制器:

         public function viewcatprice()
            {
               $this->load->model('JcMeetingExpense_model');
               $data['query1'] = $this->JcMeetingExpense_model->viewcatprice();   
               $this->load- 
                        >view('JcMeetingExpense/jc_meeting_expense',$data);
            }

型号:

          function viewcatprice()
           {
             $query = $this->db->select('*')->from('jc_price_master')->get();
             return $query->result();
           }

查看:

     <label for="catprice"></label>
     <select class="form-control" name="category">
        <?php   
        foreach($query1 as $row)
        { 
          echo '<option value="'.$row->category.'">'.$row- 
          >category.'</option>';
        }
        ?>
        </select>
         <tr>
         <td class="colone">Amount Per Head:</td>
         <td class="coltwo"></td>
         <td class="colthree"><input type="number" name="num5"  id="num5" 
         class="input-field" name="field1" style="width:35%;" />
         </td>
         </tr>

2 个答案:

答案 0 :(得分:0)

请参阅jQuery change event on dropdown

或者,如果您不想使用jQuery,请使用HTML标记的“ onchange”属性,并在JS中进行处理

答案 1 :(得分:0)

查看代码

 <select class="form-control" name="category" id='cat_id'>
    <?php   
    foreach($query1 as $row)
    { 
      echo '<option value="'.$row->category.'">'.$row- 
      >category.'</option>';
    }
    ?>
    </select>

jQuery(document).ready(function($) {
 $("#cat_id").on('change', function() {
    var cat_id = $(this).val();

    if(cat_id){
           $.ajax ({
            type: 'POST',
            url: 'php_file_that_select_price_from_category_id.php',
            data: { cat_id: cat_id },
            success : function(response) {
                var response = $.parseJSON(response);
                $('#num5').val(response.jc_price_master); 

            },error:function(e){
            alert("error");}
        });
     }
  });
});

ajax的控制器代码

 public function ajax_price_list() 
 { 
   $this->load->helper('url'); 
   $this->load->model('JcMeetingExpense_model'); 
   $data['jc_price_master'] = $this->JcMeetingExpense_model->getprice(); 
   //$this->load->view('JcMeetingExpense/jc_meeting_expense',$data); you do not have to load view here
   echo jason_encode($data);
 }
相关问题