title: How to change a Fusion Table layer query based on user input and button?
body: <p>Google provides a great example of updating a Fusion Table layer on a map here: <a href="https://developers.google.com/fusiontables/docs/samples/change_query" rel="nofollow">https://developers.google.com/fusiontables/docs/samples/change_query</a></p>
  
  <p>User input is captured like this in the HTML:</p>
  
  <pre><code>    &lt;select id="delivery"&gt;
        &lt;option value=""&gt;--Select--&lt;/option&gt;
        &lt;option value="yes"&gt;Yes&lt;/option&gt;
        &lt;option value="no"&gt;No&lt;/option&gt;
      &lt;/select&gt;
  </code></pre>
  
  <p>The query is then updated like this in the javascript:</p>
  
  <pre><code>function updateMap(layer, tableId, locationColumn) {
      var delivery = document.getElementById('delivery').value;
      if (delivery) {
        layer.setOptions({
          query: {
            select: locationColumn,
            from: tableId,
            where: "delivery = '" + delivery + "'"
          }
        });
      } else {
        layer.setOptions({
          query: {
            select: locationColumn,
            from: tableId
          }
        });
      }
  </code></pre>
  
  <p>As you can see on the link above, the query and map layer updates immediately on change.  Instead of updating immediately on change, I would like to have the user select a value in the delivery field, and then update the query on button click:</p>
  
  <pre><code>&lt;input type="button" id="button" value="Update Map"&gt;
  </code></pre>
  
  <p>Can anyone provide me with an example or modify the updateMap function to use the button click to prompt the change?</p>
  
  <p>I tried something like this but it did NOT work: </p>
  
  <pre><code>var delivery = document.getElementById('button').click();
      if (delivery) { ...
  </code></pre>
  
  <p>Thanks in advance for the help...</p>