Re: StringFilter + Selection event

[asgallant]

There isn't anything to select in a StringFilter control, perhaps what you want is the "statechange" event, which gets fired every time the user interacts with the control?

On Friday, January 11, 2013 8:44:27 AM UTC-5, david.t...@gmail.com wrote:

How can I add a select event to the StringFilter? (https://code.google.com/apis/ajax/playground/?type=visualization#stringfilter_control)

(like it's done here: https://code.google.com/apis/ajax/playground/?type=visualization#select_event but for a simple table).

[david.t...@gmail.com]

Why not?

If for example I want to have a table of people (with name, id, etc.) and when clicking on someone I want something specific to happen (or at least be able to read the id, first name, etc)

[asgallant]

Oh, you want to implement a select event in your chart/table, not the control.  Here's example code you can plug into the playground code for the StringFilter control:

google.visualization.events.addListener(table, 'select', function () {
  var sel = table.getChart().getSelection();
  var tmpData = table.getDataTable();
  var msgArray = ['You have selected:'];
  for (var i = 0; i < sel.length; i++) {
    msgArray.push(tmpData.getValue(sel[i].row, 0));
  }
  alert(msgArray.join('\n'));
});

Put that in the code after you create the table and before you create the dashboard.

[david.t...@gmail.com]

Great, it works!

Thank you!

[asgallant]

You're welcome.

[david.t...@gmail.com]

There's a little bug there that I can't find. The exact code you posted..

When you click on someone I get an alert, if I click on it on the 2nd time (on the same line)  it's undefined, on the 3rd time (again on the same line) it's back again and so on..

Any idea why?

[asgallant]

If you click on a selected element, it deselects that element, but the "select" event is still fired.  You can test to see if anything is selected by checking the length of the array returned by table.getChart().getSelection():

google.visualization.events.addListener(table, 'select', function () {
  var sel = table.getChart().getSelection();

  if (sel.length > 0) {

    var tmpData = table.getDataTable();
    var msgArray = ['You have selected:'];
    for (var i = 0; i < sel.length; i++) {
      msgArray.push(tmpData.getValue(sel[i].row, 0));
    }
    alert(msgArray.join('\n'));
  }
});

[david.t...@gmail.com]

Can I deselect an element manually in code without requiring another click?

Because currently, the solution you offered requires 2 clicks on the same element when the first (deselect) does nothing and the 2nd one is the select one.

[asgallant]

Yes, you can deselect an element in code.  The #setSelection method takes an array of objects with "row" and/or "column" properties that identify the element(s) selected.  Remove the element you want to deselect from the array and pass the array back to #setSelection.  To deselect all elements, you can call #setSelection without passing any parameters.