Ändern zuerst Datensatz auswählen

Question

Ich habe einen JavaScript-Code, um ein zweites Auswahlfeld basierend auf der Auswahl des ersten zu füllen, aber ich habe einige Probleme, damit es richtig funktioniert.

Wenn ich mindestens 2 Auswahlwerte habe, wird bei Änderungsereignis das nächste Auswahlfeld korrekt ausgelöst, aber wenn ich nur eine Option habe, da das Änderungsereignis nicht möglich ist, kann ich das nächste Auswahlfeld auslösen mit dem geladenen Wert?

<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> 

Grundsätzlich, wenn mein Code mindestens zwei Möglichkeiten hat, funktioniert es:

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

Otherwhise wenn es nur eine Option hat es nicht, da ich das Änderungsereignis abfeuern kann nicht funktioniert:

Ich möchte es funktionieren lassen, ohne eine "dummy Select Option wie" "Select ..." in der Auswahlbox zu verwenden. Was könnte der beste Weg sein, um es zu erreichen. Ich brauche Stunden, um es richtig zu machen.

Answer 1

Tatsächlich ändern Sie das Ereignis nicht, wenn nur eine Option im Tag auswählen. macht eine Funktion und rufen Sie einfach nach dem Laden Dokument und auch in Änderungsereignis

<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

Ich habe eine Lösung gefunden, aber nicht wissen, ob sie die besten Art und Weise. Warten auf Ihre Bedenken zu diesen Optionen.

Grundsätzlich habe ich den Code verdoppelt. One mit dem Änderungsereignis, und ein anderer nur mit der gewählten Option:

<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> 

Ist dies der richtige Weg, es zu tun, oder sollte ich etwas ändern?