dartdart-webui

How to get a clicked element's text content, with Dart?


I'm using dart to develop an app and i want to get the value of a clicked element. I.e:

Html:

<div id="blah">Value!!</div>

Dart:

void main(){
    query("#blah").onClick.listen(showValue);
}

void showValue(Event e){
   //Get #blah's innerHtml based on the Event(Something like e.target.innerHtml or e.target.value)
}

Anyone? I know how to do it in JS, but I want to know if there's a way to do it in DART!

Edit

Thanks to all of you, I'll try to be a little bit more clear. I have a loop that generates 9 elements dynamically and add them to a container.

Code:

var j = 0;
  var optionsSquare = query("#optionsPanel");
    while(j < 9){
      DivElement minorSquare = new DivElement();

      var minorSquareHeight = optionsSquare.clientHeight/3;
      var minorSquareWidth = optionsSquare.clientWidth/3;

      minorSquare
       ..attributes = {"class": "miniSugg"}
       ..style.width = (minorSquareWidth.round()-2).toString().concat("px")
       ..style.height = (minorSquareHeight.round()-2).toString().concat("px")
       ..style.float = "left"
       ..style.border = "1px solid"
       ..innerHtml = (j+1).toString();
       ..onClick.listen(showOptionsSquare);

      optionsSquare.children.add(minorSquare);
      j++;
    }

If I try using @Pandian's way, it works, but I only get the value of the last element inside the loop. What I want is to somehow, track down the element clicked and get its value!

EDIT 2

Guys, just solved it!

I'll let the code here as a repo if someone needs this information:

void showOptionsSquare(Event e){
  window.location.hash = "#optionsPanel";
  mainDiv.style.opacity = (0.2).toString();

  DivElement clicked = e.target;
  window.alert(clicked.innerHtml);
}

[]'s


Solution

  • Try like below... it will help you...

    DivElement div;
    
    void showValue(){
          window.alert(div.innerHTML); 
    }
    
    void main() { 
      div = query('#blah');
      div.on.click.add((Event e) => showValue());
    }