无法使用Emberjs来处理Ajax POST [英] Unable to get Ajax POST working with Emberjs

问题描述

我现在要做的是尝试通过Ajax POST将数据发送到数据库。我将首先从HTML表单开始，

What I am trying to do now is trying to send data to the database via Ajax POST. I will first start with the HTML form I have,

<script type="text/x-handlebars" id="project">
    <div class="row">
        <div class="span6">
            <form class="form-horizontal">
                <div class="control-group">
                    <label class="control-label" for="projectname">Project Name: </label>

                    <div class="controls">
                        {{!view App.TextFieldEmpty}}
                        <input type="text" id="projectname" required title="First Name is Required!" pattern="[A-z ]{10,}" placeholder="Enter Project Name"/>
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="projectdesc">Project Description:</label>

                    <div class="controls">
                        <textarea rows="3" id="projectdesc" placeholder="Enter Project Desc"
                                  required="Description Required"></textarea>
                    </div>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <button class="btn" {{action 'createNew'}}>Add Project</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</script> 

接下来，是我的 App.js 根据Ember指南，我们必须首先映射模板？所以这里是我的路由器：

Next, is my App.js, According to Ember guidelines, we have to map templates first right? So here it is my router:

App.Router.map(function() {

    this.resource('project');

});

接下来，我将数据插入的表是一个简单的表，只有三个字段; id，projectname& projectdesc 。

Next, the table I am inserting the data into is a simple one, having just three fields; id, projectname & projectdesc.

App.Model = Ember.Object.extend({

});

App.Project = App.Model.extend({
    id : null,
    projectname : null,
    projectdesc : null
});

现在关于这个问题，

App.ProjectController = Ember.ArrayController.extend({
    actions : {
        createNew : function() {
            this.get('model').createNew();
        }
    }
});
    App.ProjectRoute = Ember.Route.extend({

    });


    App.Project.reopenClass({
        createNew : function() {

            dataString = $("#project").serialize();

            $.ajax({
                type : "POST",
                url : "http://ankur.local/users/createNewProject",
                data : dataString,
                dataType : "json",
                success : function(data) {
                    alert("yes");
                }
            });
        }
    });

我在控制台上收到此错误：

I am getting this error on the console:

Uncaught TypeError: Object [object Array] has no method 'createNew' 

似乎在线上

this.get('model').createNew();

此外，我使用非RESTful PHP后端。

Furthermore, I am using non-RESTful PHP backend.

即使我认为我已经在模型中创建了该方法。无论如何，我已经使用了GET这样的方式，它的工作，但区别是我在模型中返回的方法。在这种情况下，我以为我不得不从控制器调用该方法。我可能做错了什么？我会感谢任何帮助或建议。

Even though I think I have created the method in the model. Moroever, I have used the GET exactly this way and it worked but the difference was I returned the method in the model. In this case, I thought I had to call the method from the controller. Where I might be doing wrong? I would appreciate any help or suggestions.

推荐答案

而不是

this.get('model').createNew();

请尝试以下。

App.Project.createNew();

这篇关于无法使用Emberjs来处理Ajax POST的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！