empeypp

Multiple Drop Menu Query

Discussion created by empeypp on Jul 20, 2011
Latest reply on Oct 15, 2012 by amaynard
  • Comment • 3
I'm trying to create 2 drop menus that will run just one query. In other words, if the user wants to know conferences within 3 weeks, they could choose both events and date from two drop menus.

Here is the JavaScript code that  seems to be working fine:

function queryEvents() {
  // get current dropdown values
  var dateRangeDD = document.getElementById("dateRange");
  var dateRange = dateRangeDD.options[dateRangeDD.selectedIndex].text;
  var dateRangeVal = dateRangeDD.options[dateRangeDD.selectedIndex].value;
  alert ("dateRange = " + dateRange + ", dateRangeVal = " + dateRangeVal);
  var typeDD = document.getElementById("eventType");
  var eventType = typeDD.options[typeDD.selectedIndex].text;
  var eventTypeVal = typeDD.options[typeDD.selectedIndex].value;
  alert ("eventType = " + eventType + ", eventTypeVal = " + eventTypeVal);
  var dateRangeSQL;
  switch (dateRange) {
   case "sqlAll":
    dateRangeSQL = sqlAll;
    break;
   case "sqlWeeks2":
    dateRangeSQL = sqlWeeks2;
    break;
   case "sqlWeeks4":
    dateRangeSQL = sqlWeeks4;
    break;
   case "sqlMonths3":
    dateRangeSQL = sqlMonths3;
    break;
   case "sqlMonths6":
    dateRangeSQL = sqlMonths6;
    break;
  }
  alert ("dateRangeSQL = " + dateRangeSQL);
  
  // get where clause for event type
  var eventTypeSQL;
  switch (eventType) {
   case "All":
    eventTypeSQL = "Type = '*'";
   case "Conference":
    eventTypeSQL = "Type = 'Conference'";
    break;
   case "Lecture":
    dateRangeSQL = "Type = 'Lecture'";
    break;
   case "Workshop":
    dateRangeSQL = "Type = 'Workshop'";
    break;
  }
 
 
 // built full SQL where clause for query
 var whereSQL = dateRangeSQL + " AND " + eventTypeSQL;
 
 // execute query
 executeQueryTask(whereSQL);

 }


And here is the HTML Code that I can't quite figure out.

<form name="campsite_search"  method="get">
 <select name="state" id="dateRange">
         <option value="sqlAll">All events</option>
   <option value="sqlWeeks2">2 Weeks</option>
   <option value="sqlWeeks4">4 Weeks</option>
   <option value="sqlMonths3">3 Months</option>
   <option value="sqlMonths6">6 Months</option>
    </select>
    <select name="radius" id="eventType">
   <option value="All">All events</option>
   <option value="Conference">Conference</option>
   <option value="Lecture">Lecture</option>
   <option value="Workshop">Workshop</option>  
    </select>
 <input type="BUTTON" OnClick="queryEvents()"  class="input" value="Continue" />


Any thoughts?

Thanks,
Pat

Outcomes