JQuery check if an option is selected and throw an error

Question

URL: www.Wyler.com

Problem: If you go to this site look at the inventory search bar right below the navigation menu. I need a script that throws an error if you try to click the "search" button if "new" and "select dealer" are selected. I tried to do this based on which options had a selected attribute but i'm not sure that attribute is actually being added to the selected options. I am really just trying to get the search button to throw an error saying "please select a dealer" if someone tries to search for new vehicles and leaves the other filter on "select dealer". So sorry i don't have the code, but feel free to use firebug on the site.

Thanks! Let me know if you have any questions.

Answer 1

First up, jQuery is a library in JavaScript - you can happily use any JavaScript side by side with jQuery, jQuery just provides a short-hand/easier way of doing certain things.

If you can't find a nice clean jQuery way to do something, I'd try broadening your search to just javascript.

You can use if... else blocks in javaScript to identify and test the values of the elements you're after, and write yourself a javaScript function that you trigger via the event handler.

Have a look here - http://www.w3schools.com/js/js_if_else.asp - something similar to that will get you where you want to be, obviously you're using the field values to compare rather than arbitrary values, and you'll probably use Window.Alert() rather than Document.Write(0.

Answer 2

Here is a snippet that does what you want ..

$('form.inventory-quick-search').submit(function(){
 if ( $('#DepartmentId').val() === '2' && $('#DealerId').val() === '')
    {
      alert('Please select a dealer');
      return false;
    }
  return true;
});