2017-02-27 62 views
0

我想使一個應用程序在阿賈克斯笨,選擇一個類型的產品並出現一個包含標記的產品下拉填入表AJAX笨

所以這裏的價格表是我做了什麼,並感謝您幫助我使用此代碼。 控制器:

public function produit() 
 
\t { 
 
\t \t $data['listType']=$this->test_m->findtype(); 
 
\t \t return $this->load->view('produit',$data);//List of product types 
 
\t } 
 
    
 
\t public function getprod($idv) 
 
\t { 
 
\t \t $this->test_m->idv=$idv; 
 
\t \t $prod=$this->test_m->req_prod(); 
 
\t \t header('Content-Type: application/x-json;  charset=utf-8');//to display the table 
 
     \t echo json_encode($prod); 
 
\t }

型號:

function findtype() 
 
    { 
 
    \t $query=$this->db->get('valve'); 
 
    \t return $query->result(); //dropdown types 
 
    } 
 

 
    function req_prod() 
 
    { 
 
     if(!is_null($this->idv)){ 
 
      $this->db->select('taille,reference,marque,prix,quantite '); 
 
      $this->db->where('idv', $this->idv); 
 
      $prod = $this->db->get('produit'); 
 

 
      // if there are suboptinos for this option... 
 
      if($prod->num_rows() > 0){ 
 
       $prod_arr; 
 

 
       // Format for passing into jQuery loop 
 

 
       foreach ($prod->result() as $option) { 
 
        $prod_arr[] = $option->taille; 
 
        $prod_arr[] = $option->reference; 
 
        $prod_arr[] = $option->marque; 
 
        $prod_arr[] = $option->prix; 
 
        $prod_arr[] = $option->quantite; 
 

 
       } 
 

 
       return $prod_arr; 
 
      } 
 
     } 
 

 
     return; 
 
    }

並查看:

<div id="ess"> 
 
\t <select name="vl1" id="vl1"> 
 
\t \t <option>--select valve--</option> 
 
\t \t <?php foreach($listType as $pr){?> 
 
\t \t <option value="<?php echo $pr->idv;?>"><?php echo $pr->type?></option> 
 
\t \t <?php }?> 
 
\t </select><br> 
 
</div> 
 
<p>Nos produits</p> 
 
<div id="pr1"> 
 
\t <table> 
 
      <tbody> 
 
       <tr id="prod"> 
 
        <td><label>Produits au choix</label></td> 
 
          
 
       </tr> 
 
      </tbody> 
 
     </table> 
 
</div> 
 

 
<script type="text/javascript"> 
 
     $(document).ready(function(){ 
 
     $('#vl1').change(function(){ //any select change on the dropdown with id options trigger this code 
 
      var idvlv = $('#vl1').val(); // here we are taking option id of the selected one. 
 

 
      $.ajax({ 
 
       type: "POST", 
 
       url: "/test_c/getprod/"+idvlv , //here we are calling our dropdown controller and getprod method passing the option 
 
    
 
       success: function(prod) //we're calling the response json array 'suboptions' 
 
       { 
 
        $.each(prod,function(taille,reference,marque,prix,quantite) //here we're doing a foeach loop round each sub option with id as the key and value as the value 
 
        { 
 
         var opt = $('<td/>'); // here we're creating a new select option for each suboption 
 
         opt.val(taille); 
 
         opt.val(reference); 
 
         opt.val(marque); 
 
         opt.val(prix); 
 
         opt.val(quantite); 
 
         $('#prod').append(opt); //here we will append these new select options to a dropdown with the id 'suboptions' 
 
        }); 
 
       } 
 
    
 
      }); 
 
    
 
     }); 
 
    }); 
 
    </script>

錯誤是無法加載資源:服務器與404狀態響應(未找到) 和:[違反]長時間運行的JavaScript任務需要304ms

回答

0

添加AJAX在這之前。

var BASE_URL = "<?php echo base_url(); ?>"; 

在路由添加,

$ [ '測試'] = '控制器/功能';

和AJAX請求,

url: BASE_URL + 'test'; 
data:{data:idvlv}, 

和控制器,

$這 - >輸入 - >柱( '數據');

+0

謝謝你的回答,但我試過了,但是即使是錯誤 –

+0

可能是那個控制器有故障,但我不知道 –

+0

我已經編輯了代碼試了一次。 –