2011-04-20 2 views
0

PHP 스크립트에서 JSON을 동적으로 사용하여 JQuery로 생성 된이 드롭 다운 (선택) 메뉴가 있습니다. 첨부 된 그림, 구성 요소 레이블을 참조하십시오. "선택"메뉴에는 구성 요소 이름과 구성 요소 ID (값)가 있습니다. example변경시 JQuery 동적 드롭 다운 메뉴가 다른 필드를 채 웁니다.

JQuery를 사용하여 "change on"이벤트를 사용하여 Code, Category 및 UOM을 해당 값으로 채 웁니다.

내 JSON 객체는 필요한 모든 것을 검색합니다 (JQuery 자동 완성으로이 작업을 수행 할 수있었습니다).

예 :

[{"id":"4","component":"Component 1","code":"COMP1","uom":"kilo","category":"Flour"}...] 

위의 JSON에서 오는 옵션을 사용하여 "선택"메뉴를 생성하는 코드입니다.

$.getJSON("<?php echo site_url('products/dropdown/no'); ?>", function(result) { 
      var optionsValues = '<select>'; 
      optionsValues += '<option value="">' + '--' + '</option>'; 
      $.each(result, function() { 
      optionsValues += '<option value="' + this.id + '">' + this.component + '</option>'; 
      }); 
      optionsValues += '</select>'; 
      var options = $("select[name=component]"); 
      options.replaceWith(optionsValues); 
     }); 

이것은 $ (document) .ready에 있습니다.

그래서 "선택"메뉴에서 변경이 발생할 때마다 해당 값으로 언급 된 필드가 채워지는 함수 또는 무언가가 필요합니다.

대단히 감사합니다. 페이지가로드 된 후 당신이 선택 요소를 생성하는 경우

답변

4
$('select').change(function(){ 
    //Populate other fields 
    //$.getJSON() 
    //$('input.code').val(response.code) 
    //etc... 
}); 

또는, 당신은 사용할 수 있습니다

을 선택 요소를 채우기 :

$('select').live('change', function(){ 
    //Populate other fields 
}); 
+0

어떻게 드롭 선택된 값에 대응하는 그 고유 값 (코드 카테고리 UOM)를 참조 하는가? –

+0

getJSON 함수에서 result.code, result.category 등을 사용하여 PHP 스크립트에서 값을 가져올 수 있습니다. 그런 다음 $ ('input [name = code]'). val (result.code) 또는 필드를 추가하기 위해 호출 된 모든 것. – Calum

0
$("#select").change(function(){ 


}); 
0

이것은 어떻게 작동하는지 내가 만든 것입니다 JSONObject 변수에 결과를 저장합니다.

언제 사용자 선택 메뉴의 값을 변경

$("select#component").live('change',function() { 
      if(this.selectedIndex == '') 
      { 
       $("input#code").val(''); 
       $("input#category").val(''); 
       $("input#uom").val(''); 
       return false; 
      } 
      $("input#code").val(JSONObject[this.selectedIndex-1].code); 
      $("input#category").val(JSONObject[this.selectedIndex-1].pcname); 
      $("input#uom").val(JSONObject[this.selectedIndex-1].uname); 
     }); 
관련 문제