Ändra värdet för andra val vid första val

Som du sa att du inte har erfarenhet av jQuery eller Ajax, jag kommer att lägga upp mitt svar med så många kommentarer som möjligt. Jag antar att du har två rullgardinsmenyer på din sida.

Den första innehåller byggarna, så den kommer att ha id="builders" .

Den andra innehåller regionerna, så den kommer att ha id="regions" .

Vad jag förstår kommer det första valet att vara exakt det du postade i din fråga, genererat på serversidan (av PHP). Jag ber bara att du gör en liten ändring av den, så att varje alternativvärde är lika med byggarens databas-ID och inte dess namn (såvida inte byggarens primärnyckel är deras namn och inte ett ID). Detta kommer inte att göra någon skillnad för slutanvändaren men kommer att vara viktigt för vår jQuery-lösning. Den andra kommer att vara tom, eftersom tanken är att fylla den dynamiskt med de regioner som är relaterade till byggaren som valts i den första rullgardinsmenyn.

Låt oss nu komma till jQuery-koden:

//Everything that goes below this first line will be ready as soon as the page is fully loaded
$(document).ready(function() {
  //The following code defines an event. More precisely, we are defining that the code inside it will run every time our select with id "builders" has its value changed
  $('#builders').change(function() {
    //$(this) is our builders select. $(this).val() contains the selected value, which is the ID of our selected builder
    var currentValue = $(this).val();
    //Now, this is our Ajax command that will invoke a script called get_regions.php, which will receive the builder's ID in $_GET['builder_id'] and you can use to query your database looking for all regions related to this builder. Make sure to create an array with the returned regions. Your get_regions.php's last line should be echo json_encode($regions); 
    $.get("get_regions.php", {'builder_id': currentValue}, function(data) {
      //Inside this function is the code that will run when we receive the response from our PHP script. It contains a JSON encoded list of regions, so first of all we need to parse this JSON
      var regions = $.parseJSON(data);
      //Before filling our second select dropdown with the regions, let's remove all options it already contains, if any
      $('#regions').empty();
      //Now, all there is left is to loop over the regions, adding each as an option of the regions dropdown. I'll do it the universal way
      for (var i = 0; i < regions.length; i++) {
        var regionOption = '<option value="'+regions[i]['region_name']+'">';
        regionOption += regions[i]['region_name'];
        regionOption += '</option>';
        $('#regions').append(regionOption);
      }
    });
  });
});

Trots eventuella syntaxfel (kan inte testa koden härifrån) borde detta göra susen. Hoppas kommentarerna var tillräckligt tydliga för att du skulle förstå hur saker och ting fungerar i jQuery.