0
votes

I am creating a post that has a description and created at time stamp.But when I submit the form i get the error

Nothing handled the action 'addPost'. If you did handle the action, this error can be caused by returning true from an action handler in a controller, causing the action to bubble. Error

This is my controller

import Ember from 'ember';

export default Ember.Controller.extend({
actions: {
    addPost: function(){

        var description = this.get('description');

        //Create New Post
        var newPost = this.store.createRecord('post', {

            description: description,

        });

        // Save to Database
        newPost.save();

        // Clear Form
        this.setProperties({

            description: '',

        });
    }
}
});

This is my model

import Model from 'ember-pouch/model';
import DS from 'ember-data';

const {
  attr,
  hasMany,
  belongsTo
} = DS;

export default Model.extend({
description: DS.attr('string'),
createdAt: DS.attr('date', {
defaultValue() { return new Date(); }
})
});

This is the view

<form>
<lable>Enter the post</lable>
{{input type="text" value=title }}
<button {{action 'addPost'}} >post</button>
</form>

This is the router.js

import Ember from 'ember';
import config from './config/environment';
const Router = Ember.Router.extend({
   location: config.locationType,
   rootURL: config.rootURL
});
Router.map(function() {
   this.route('posts', function() {
   this.route('new');
   });
});
export default Router;

Unable to figure out what is the error.

1
Template name is post/new.hbs and controller name is post/new.jsAkash Ghosh
<button {{action 'addPost'}} >post</button> this code is in which file ?Ember Freak
this code is in templates/post/new.hbsAkash Ghosh
hbs path should be templates/posts/new.hbs and controller path should be controllers/posts/new.jsEmber Freak
yes that was the problemAkash Ghosh

1 Answers

0
votes

We should have same file name for both template hbs and controller js file. suppose if your template is app/templates/login.hbs then corresponding controller would be app/controllers/login.js.

If it's nested, then also it should maintain same hierarchy like app/templates/dashboard/user.hbs corresponding controller would be app/controllers/dashboard/user.js

In your case, just ensure controller filename is same and following the same hierarchy like I mentioned above.