Как получить значение текстового поля в ember.js

Question

Я начал работать на ember.js всего за день до этого. Я не знаю, как получить значение текстового поля при отправке. Я попытался как этот

это HTML

<script type="text/x-handlebars" data-template-name="index"> 
    <div > 
    <p>{{view Ember.TextField valueBinding="fname"}}</p> 
    </div> 
    <div> 
    <p>{{view Ember.TextField valueBinding="lname"}}</p> 
    </div> 
    <button {{action save}}>submit</button> 
    </script> 

это мой ember.js файл

  App = Ember.Application.create(); 
      App.IndexController = Ember.ObjectController.extend({ 

      save:function() 
      { 
       var fname=this.get('fname'); 
       var lname=this.get('lname'); 
       alert(fname+','+lname); 


      } 
      }); 

всякий раз, когда я нажав на кнопку отправки, я получаю не определено в alert.so как получить ценность? Я надеюсь, что кто-нибудь поможет мне продолжить работу в ember.js

Answer 1

Ваша проблема в том, что ваша форма не имеет модели. Вы можете предоставить его, используя model или setupController крючок.

App.IndexRoute = Ember.Route.extend({ 
    model: function() { 
    return {}; 
    }, 
    // or 
    setupController: function(controller) { 
    controller.set('model', {}); 
    } 
}); 

Кроме того, некоторые советы:

Используйте кнопки action name on="submit" в форме, а не в action name кнопку отправки. Таким образом, вы можете выполнить действие, когда пользователь нажимает клавишу ввода на входе.

И input type="text" помощник ярлык для view Ember.TextField

<script type="text/x-handlebars" data-template-name="index"> 
    <form {{action save on="submit"}}> 
     <div > 
      <p>{{input type="text" valueBinding="fname"}}</p> 
     </div> 
     <div> 
      <p>{{input type="text" valueBinding="lname"}}</p> 
     </div> 
     <button>submit</button> 
    <form> 
</script> 

Here a live demo

Answer 2

Это действительно хороший учебник по mavilein.

Мы можем это сделать и на уровне контроллера.

App.IndexController = Ember.ObjectController.extend({ 
     content:function(){ 
      return {fname:null,lname:null} 
      }.property(), 
     save:function() 
     { 
      var fname=this.get('fname'); 
      var lname=this.get('lname'); 
      alert(fname+','+lname); 


     } 
}); 

Или мы можем сделать это

App.IndexController = Ember.ObjectController.extend({ 
     fname:null, 
     lname:null, 
     save:function() 
     { 
      var fname=this.get('fname'); 
      var lname=this.get('lname'); 
      alert(fname+','+lname); 


     } 
     }); 

Answer 3

в JS, как этот

App.WebFormController = Ember.Controller.extend({ 
    fname: null, 
    lname: null, 
    save: function() { 
     var fname = this.get('fname'); 
     var lname = this.get('lname'); 
     alert(fname + ',' + lname); 
    } 
}); 

без нужна модель

в шаблоне, как этот

<script type="text/x-handlebars" data-template-name="web_form"> 
    <form {{action save on="submit"}}> 
     <div > 
      <p>{{input type="text" valueBinding="fname"}}</p> 
     </div> 
     <div> 
      <p>{{input type="text" valueBinding="lname"}}</p> 
     </div> 
     <button>submit</button> 
    </form> 
</script> 

Answer 4

Ниже код работает для меня:

cshtml: В сценарии по тегу указать-шаблонный имя данных = "текст"

<script type="text/x-handlebars" data-template-name="text"> 
    {{view Ember.TextField value=view.message}} 
    {{view Ember.TextField value=view.specy}} 
    {{textarea value=view.desc id="catdesc" valueBinding="categor" cols="20" rows="6"}} 

    <button type="submit" {{action "submit" target=view}}>Done</button> 
    </script> 

app.js:

App.TextView = Ember.View.extend({ 
templateName: 'text', 
message:'', 
specy: '', 
desc:'', 
actions: { 
    submit: function (event) { 
     var value = this.get('specy'); 
     var spc = this.get('message'); 
     var de = this.get('desc'); 
    } 
} 
});