Codeigniter를 사용하여 재질 디자인에서 ajax 호출을 작성하십시오.

Question

여기에서 재료 설계 라이트를 사용하여 다음과 같은 코드를 작성했지만 해당 필드에 결과가 표시되지 않습니다. 여기 내 코드는,보고

<script> 
$('#type').change(function(){ 
    var type=$('#type').val(); 
    alert(type); 
    var url='<?php echo base_url(); ?>admin/vehicle/ajax_vehicle'; 
    alert(url); 
    $.post(url, {type:type}, function(data) 
    { 
    alert(); 
    componentHandler.upgradeDom();  
    $('#vehicle').html(data); 
    }); 
}); 
</script> 

을하시기 바랍니다 여기

public function ajax_vehicle() 
{ 
    $data['vehicle']=$this->Vehicle_model->view_available_vehicles($_POST['type']); 
    //var_dump($data['vehicle']); 
    $this->load->view('admin/vehicle/ajax_vehicle',$data); 
} 

가 여기 내보기 페이지

<div class="input-field col s12"> 
     <select required name="vehicle_id" id="vehicle"> 
     <option value="" selected>Select</option> 


     </select> 
     <label>Select Vehicle</label> 
</div> 

var type=$('#type').val();가 값을 받고 내 컨트롤러입니다. 내가 그것을 콘솔 때 난이, 내 ajax_vehicle입니다 choosed 할 유형을 선택한 후이의 내용을 표시하기 위해 필요한이

<select required name="vehicle_id"> 
    <option value="">Select</option> 
    <option value="42" >bullet</option> 
    <option value="41" >pulsar</option> 
</select> 

같은 결과를 얻었다.

<select required name="vehicle_id"> 
<option value="">Select</option> 
<?php if(empty($assign_vehicle_info)){ 
     if (!empty($vehicle)) { 
     foreach ($vehicle as $veh) {?> 
<option value="<?= $veh->id ?>"<?php if (!empty($assign_vehicle_info)) { echo $assign_vehicle_info->vehicle_id == $veh->id ? 'selected' : ''; } ?>><?= $veh->name ?></option> 
<?php }}}?> 
</select> 

실제로, 당신이 상태로 나를 data이

<select required name="vehicle_id"> 
    <option value="">Select</option> 
    <option value="42" >bullet</option> 
    <option value="41" >pulsar</option> 
</select> 

을 포함

Answer 1

경우 해결하는 데 도움이 work.pleae이에 추가 할 추가로 어떤 것들을 그 결과를 모르는 $('#vehicle').html(data);은

<select required name="vehicle_id" id="vehicle"> 
    <select required name="vehicle_id"> 
    <option value="">Select</option> 
    <option value="42" >bullet</option> 
    <option value="41" >pulsar</option> 
    </select> 
</select> 

입니다. 무의미하고 잘못된 HTML html() 함수는 요소 자체가 아닌 내부 HTML을 선택한 요소로 바꿉니다.

당신은 두 가지 옵션이 있습니다

1) 서버 출력 (즉 ajax_vehicle보기 변경을) 그래서 그냥 <option> 요소를 반환 -뿐만 아니라 <select>의 외부 부품을 반환 할 필요. 따라서 아약스 호출에서 반환 된 결과 data은 (예를 들어)를 포함해야합니다 :

<option value="">Select</option> 
<option value="42" >bullet</option> 
<option value="41" >pulsar</option> 

는 그런 다음 이전 $('#vehicle').html(data);를 계속 사용할 수 있습니다.

OR

2)를 사용 replaceWith, 즉 $("#vehicle").replaceWith(data); 대신 .html(). 그러나이 경우 <select>에 id="vehicle" 마크 업이 포함되도록 서버 출력을 수정해야합니다. 그렇지 않으면 "차량"이라는 요소가 더 이상 존재하지 않으므로이 코드는 두 번째로 작동하지 않습니다. 또한 "Vehicle"요소에 설정된 이벤트 핸들러 등이있는 경우 전체 요소를 대체 했으므로 다시 작성해야합니다. http://api.jquery.com/replacewith/

제 생각에는 옵션 1이 더 나은 선택입니다.