title: Jquery get values from select boxes and make AJAX call
body: <p>I have multiple select boxes, where I want to get the value of each selected option and make an AJAX call based on the selected options. How can I achieve that?</p>
  
  <p>I have this so far:</p>
  
  <pre><code>$('select[name="restaurant_chosen"]').on('change', function() {
      var restaurant_id = $(this).val();
  });
  
  $('select[name="date_chosen"]').on('change', function() {
      var date_chosen = $(this).val();
  });
  
  $.ajax({
     type: 'GET',
     url: '/api/' + restaurant_id + '/' + date_chosen +
     success: function(data) {
       console.log(data)
     }, 
     error: function(data){
      console.log('error')
    }
   });
  </code></pre>
  
  <p>the 2 variables <code>restaurant_id</code> and <code>date_chosen</code> I get the error <code>not defined</code>. What am I doing wrong?</p>