Question

Hey all,
I know this question has been asked a million times before but I just can’t seem to convert the answers into my personal project. I have a selector on my page that needs to send an AJAX query to my database and retrieve the results and print them under the selector. Thank you to anyone who can clarify what needs to be done for this to work.

Here is the php file called “view.php” minus the query I make to the database.

$depView = $_POST['depView'];

foreach($result as $entry){
echo  '<div>' . $entry['department']. $entry['CRN']. ' ' . $entry['title'] . ' ' . $entry['addDate'] . '</div>';
}

Here is my Javascript thus far:

function getProps(data){
        $.post("view.php", {depView: data}, html)

        }

Here is my selector:

<select onchange="getProps(value);" name="depView">
        <option value=""></option>
        <option value="CSC">CSC</option>
        <option value="MAT">MAT</option>
        </select></br>

Answer 1

HTML:

<select name="depView" id="depView">
  <option value=""></option>
  <option value="CSC">CSC</option>
  <option value="MAT">MAT</option>
</select><br />
<div id="ajaxResults"></div>

JavaScript:

<script type="text/javascript">

// on DOM load
$(function () {

  $('#depView').change(function () {
    $.post('view.php',
       { depView: $(this).val() },
       function (data) {
         $('#ajaxResults').html(data);
       },
       'html'
       );
  });

});

</script>