Call PHP via AJAX
<p>My user needs to pick an option from a first <code>&lt;select&gt;</code> and according to his selection, a second <code>&lt;select&gt;</code> should offer different options.</p>

<p>You may have seen this when picking a State after picking a Country in many many websites.</p>

<p>I know there are hundred other questions like this but I have tried lots of their answers without any success.</p>

<p>So, here is where I am standing right now:</p>

<pre><code>            &lt;div class="col-md-2"&gt;
              &lt;span class="input-group-addon" id="basic-addon1" style="border:solid 1px #CCC; border-radius:4px;"&gt;Juzgado: &lt;/span&gt;
              &lt;select class="form-control" id="juz" name="juz"&gt;
                &lt;option value="1"&gt;Juzgado 1&lt;/option&gt;
                &lt;option value="2"&gt;Juzgado 2&lt;/option&gt;
                &lt;option value="3"&gt;Juzgado 3&lt;/option&gt;
              &lt;/select&gt;
            &lt;/div&gt;

            &lt;div class="col-md-2" id="nomDiv"&gt;
                  &lt;span class="input-group-addon" id="basic-addon1" style="border:solid 1px #CCC; border-radius:4px;"&gt;Nominación: &lt;/span&gt;
                  &lt;select class="form-control" id="nom" name="id_juz_nom"&gt;

                  &lt;/select&gt;
            &lt;/div&gt;
</code></pre>

<p>Then... my AJAX</p>

<pre><code>&lt;script type='text/javascript'&gt;
        $(document).ready(function(){
            $('select[name=juz]').on('change', function() {

                var juz = $(this).val() 

                $.ajax({
                url: "tomarNominaciones.php",
                type: "POST",
                data: { juz.value },

                success: function (response) {

                        document.getElementById('nom').innerHTML= response;

                }
            });
          });
        });

&lt;/script&gt;
</code></pre>

<p>And finally this is my PHP:</p>

<pre><code>    &lt;?php 
$juz = $_POST['juz'];
include 'conectar.php';
mysql_select_db('juz_nom');
$query  = "SELECT * FROM juz_nom WHERE juzgado=\"".$juz."\"";
$result = mysql_query($query);
?&gt;

&lt;span class="input-group-addon" id="basic-addon1" style="border:solid 1px #CCC; border-radius:4px;"&gt;Nominación: &lt;/span&gt;
&lt;select class="form-control" id="nom" name="id_juz_nom"&gt;
&lt;option&gt;Seleccione Nominación&lt;/option&gt;
&lt;?php while ($row=mysql_fetch_array($result)) { ?&gt;
&lt;option value=&lt;?php echo $row['id_juz_nom']?&gt;&gt;&lt;?php echo $row['nominacion']?&gt;&lt;/option&gt;
&lt;?php } ?&gt;
&lt;/select&gt;
</code></pre>

<p>I've tried many methods such as <a href="http://www.php-dev-zone.com/2013/10/country-state-city-dropdown-using-ajax.html" rel="nofollow noreferrer">this one</a> and <a href="https://stackoverflow.com/questions/26419691/jquery-ajax-populated-html-form-when-dropdown-selected">this other one</a>. Without any success. </p>

<p>So, to be clear, <strong>what I need to do is</strong>: populate my second select with as many options as my MySQL query returns.</p>