如何在ember js中清除表单数据

时间:2014-04-23 08:30:51

标签: javascript jquery ember.js

嗨,我是非常新的ember js。我为新员工输入了一个表格,并通过route.Data发送数据成功保存。但问题是在表单提交后我的表单数据没有被清除。

代码如下:

app.js:

App.Router.map(function() {
    this.resource('saveprofile', { path: '/saveprofile/:profiledata'});
});

App.NewprofileController = Ember.ObjectController.extend({
    id:'',
    name: '',
    designation: '',

    saveProfileAction: function () {

        profiledata = [{ "id": this.get("id")}, 
        {"name": this.get("name")}, 
        {"designation": this.get("designation")}]

        pdata = $.ajax({
            type: "POST",
            dataType: "json",
            url: "/saveprofile?profiledata=" +profiledata,
            data: JSON.stringify(profiledata),
            dataType: "json",
            async: false}).done(function() {
                $.bootstrapGrowl("Employee added successfully", {
                    type: 'success',
                    align: 'center',
                    width: '1000',
                    allow_dismiss: false
                }).responseJSON
            })
        });

    console.log(pdata)
}
});

App.SaveProfileRoute = Ember.Route.extend({
    model: function(params) {
        console.log(params);
        return Ember.$.getJSON( "/saveprofile?profiledata=" + params.profiledata);
    },
})

的index.html:

     <script type="text/x-handlebars"  data-template-name="newprofile">
      <div class="panel panel-primary">
       <div class="panel-heading">
           <h3 class="panel-title">New Profile</h3>
       </div>
       <div class="panel-body">
         <form class="form-horizontal" role="form" id="form">
         <br/><br/>
       <div class="control-group">
        <label class="control-label" for="value">Employee Id:</label>
       <div class="controls"> 
            {{input type="text" class="input-medium" value=id required="true"}}
       </div>
       </div>
       <div class="control-group">
        <label class="control-label" for="value">Employee Name:</label>
       <div class="controls"> 
            {{input type="text" class="input-medium"  value=name}}
       </div>
       </div>
       <div class="control-group">
        <label class="control-label" for="value">Designation:</label>
       <div class="controls"> 
            {{input type="text" class="input-medium" value=designation}}
       </div>
       </div>      
       <div class="control-group pull-left">
        <div class="controls">
         <button type="button" class="btn btn-primary" {{action "saveProfileAction" }} id="button">Save</button>
          <button type="button" class="btn btn-primary" {{action "cancel"}} id="button">Reset</button>
        </div>
       </div>
         </form>
      </div>
     </div>
  </script>

我在stackoverflow中搜索了这个,我找到了一些解决方案,但是他们使用了save和exit函数。但我没有在ember.i中使用save方法直接保存在服务器端。

我的错误是什么。在提交表单后,请给我一些建议来清除表单数据。

1 个答案:

答案 0 :(得分:6)

您必须在控制器内执行此操作:

var controller = this;

//After saving the form to the server:
...then(function(){
 controller.set('YourFormData', '');
});

您的表单数据必须是在控制器中具有绑定的属性,例如您的ID,名称和名称。