Help with programming google graphs with a query

Discussion in 'Programming' started by mapgirl, Apr 5, 2011.

  1. #1
    Hello,
    I am trying to create a google graph from an input combobox but I'm having trouble passing the variable to the query on the spreadsheeet. The graph is able to query the spreadsheet when I don't use a varible, and my combobox is recieveing the variable but I'm having trouble connecting the two.

    The code I'm trying to use is below and I also attached a text file, so any help would be so fantastic!


    This is the combobox:

    <form>
    <table>
    <tbody><tr>
    <td>Combo Box</td>
    <td>
    <select id="combo1" name="combo1" onchange="input1.value = combo1.value">
    <option value="’1’">January</option>
    <option value="’2’">February</option>
    <option value="’3’">March</option>
    <option value="’4’">April</option>
    <option value="’5’">May </option>
    <option value="’6’">June </option>
    <option value="’7’"> July</option>
    <option value="’8’">August </option>
    <option value="’9’">September </option>
    <option value="’10’">October </option>
    <option value="’11’">November </option>
    <option value="’12’">December </option>

    </select>
    </td>
    </tr>
    <tr>
    <td>Input Box</td>
    <td>
    <input type="text" name="input1" id="input1">
    </td>
    </tr>
    </tbody></table>
    </form>


    And this is the code for the graph creation:

    <script type="text/javascript">
    var visualization;

    function drawVisualization() {
    // To see the data that this visualization uses, browse to
    // http://spreadsheets.google.com/ccc?key=pCQbetd-CptGXxxQIG7VFIQ
    var query = new google.visualization.Query(
    'https://spreadsheets.google.com/ccc?key=0Ais9xMj35wQmdDBTMUxHRS1CRHVkcGI4dnZ0c2xLZXc&hl=en');

    // Apply query language.
    query.setQuery('SELECT H WHERE E ="input1" ORDER BY F');

    // Send the query with a callback function.
    query.send(handleQueryResponse);
    }

    function handleQueryResponse(response) {
    if (response.isError()) {
    alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
    return;
    }

    var data = response.getDataTable();
    visualization = new google.visualization.LineChart(document.getElementById('visualization'));
    visualization.draw(data, {legend: 'bottom'});
    }

    google.setOnLoadCallback(drawVisualization);
    </script>
     
    mapgirl, Apr 5, 2011 IP