How to retrieve a textview calling 'focus-in' event

1

Hello, i’m trying to write simple login page with template like this

  <script type="text/x-handlebars" id="login">

    <p>Login: {{input type="text" value=title focus-in="clear"}}</p>
    <p>Password: {{input type="password" value=pass focus-in="clear"}}</p>
    <!-- <button {{action 'doLogin'}}>Login</button> -->
  </script>

For a now this doing a simple thing: Having some text in fields

Then needs to clear all the text when user clicking (focusing in) field.

I done this with the login’s page controller

App.LoginController = Ember.ObjectController.extend({
  actions: {
    setLogin: function() {
      var login = this.get('title');
      alert(login);
    },
    clear: function(_caller_) {
      _caller_ = "new text";
      //this.value = "new text";
    }
  },
  title: "Please enter your login",
  pass: "password"
})

But I don’t know how to retrieve the component, that calls focus-in action’s function``

(it may be with login or with password)

Please help me with this.

2 
App.LoginController = Ember.ObjectController.extend({
  actions: {
    setLogin: function() {
      var login = this.get('title');
      alert(login);
    },
    clear: function () {
      this.set('title', ''); // <--
    }
  },
  title: "Please enter your login",
  pass: "password"
});

Since title is a bound property from the controller, you act on that property not the component itself.

3

jasonmit, I have mean another thing.

Well, i can change title variable, so login field’s value will change too. But I have the same function for password field, so I will get login field cleared when click to type a password. I don’t expect that.

I wanted to write a function that will be clearing THIS textfield (granted a focus from user).

So I want to write a clear() event handler one time and use it.

Not to do many handlers like

clearLoginField()
clearPasswordField()

and so one…

4

Here are two approaches., I’d recommend x-better approach since it’s not accessing a private API.

5

jasonmit,

Thank you very much, interesting helpers - {{x-hack}} and {{x-better}}, I’ll try to find them in ember docs.

6

If you could use the HTML5 placeholder attribute, maybe you wouldn’t need this at all.

7

They’re not in the docs, they’re custom components he’s declaring in the JS.