첫 번째 선택 레코드 변경

Question

첫 번째 선택에 따라 두 번째 선택 상자를 채우는 JavaScript 코드가 있지만 제대로 작동하는 데 문제가 있습니다.

적어도 2 개의 선택 값이있는 경우 변경 이벤트에서 다음 선택 상자가 올바르게 실행되지만 변경 이벤트가 불가능하기 때문에 하나의 옵션 만있는 경우 다음 선택 상자를 실행하는 방법 로드 된 값으로?

<script type="text/javascript"> 
jQuery(document).ready(function() { 
$("#category").change(function(){ 
var selectedCategory = $("#category option:selected").val(); 
$.ajax({ 
    type: "POST", 
    url: "subcategories.php", 
    data: { category : selectedCategory } 
}).done(function(data){ 
    $("#subcategory").html(data); 
}); 
}); 

}); 
</script> 

는 기본적으로 내 코드는 적어도 두 가지 옵션이있는 경우, 그것은 작동 :

<select name="category" class="form-control" id="category"> 
<option value="1">Category 1</option> 
<option value="2">Category 2</option> 
</select> 

Otherwhise을 내가 변경 이벤트가 발생하지 수 있기 때문에 그것이 작동하지 않는 단 하나의 옵션이있는 경우 :

<select name="category" class="form-control" id="category"> 
<option value="1">Category 1</option> 
</select> 

선택 상자에서 "더미 선택 옵션"을 사용하지 않고 작동 시키려합니다. 그것을 달성하는 가장 좋은 방법은 무엇 일 수 있습니다. 나는 그것을 제대로하기 위해 몇 시간을 할애하고 있습니다.

Answer 1

실제로 선택 태그에 하나의 옵션 만있는 경우 이벤트가 변경되지 않습니다. 함수를 만들고 문서를로드 한 직후 및 변경 이벤트에서 호출

<script type="text/javascript"> 
    jQuery(document).ready(function() { 
     $("#category").change(function(){ 
      getSubCat();//get sub category after change event 
     }); 
     getSubCat();//get sub category after page load 
     function getSubCat(){ 
      var selectedCategory = $("#category option:selected").val(); 
      $.ajax({ 
       type: "POST", 
       url: "subcategories.php", 
       data: { category : selectedCategory } 
      }).done(function(data){ 
       $("#subcategory").html(data); 
      }); 
     } 
    }); 
</script> 

Answer 2

나는 해결책을 찾았지만 가장 좋은 방법은 없을지 모른다. 이 옵션에 대한 귀하의 우려를 기다리고 있습니다.

기본적으로 나는 코드를 두 배로 늘 렸습니다. 단지 선택 옵션을 변경 이벤트에 하나, 또 다른 :

<script type="text/javascript"> 
jQuery(document).ready(function() { 

var selectedCategory = $("#category option:selected").val(); 
$.ajax({ 
    type: "POST", 
    url: "subcategories.php", 
    data: { category : selectedCategory } 
}).done(function(data){ 
    $("#subcategory").html(data); 
}); 

$("#category").change(function(){ 
var selectedCategory = $("#category option:selected").val(); 
$.ajax({ 
    type: "POST", 
    url: "subcategories.php", 
    data: { category : selectedCategory } 
}).done(function(data){ 
    $("#subcategory").html(data); 
}); 
}); 

}); 
</script> 

이 그것을 할 수있는 적절한 방법인가, 아니면 내가 뭔가를 변경해야합니까?