EmberError: Nothing handled the action

1.1k views Asked by At

I have been struggling with making my Ember Application work with Firebase. I went through all the posts here on Stackoverflow about the similar matter but I did not find the answer to my problem. So here it is:

Whenever I try to put data into input fields and submit them with a button i get the console error:

EmberError
code : undefined
description : undefined
fileName : undefined
lineNumber : undefined
message :

"Nothing handled the action 'createBook'. 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."

My model:

import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    author: DS.attr('string'),
    picture: DS.attr('string'),
    buyer: DS.attr('string'),
    bought: DS.attr('boolean', { defaultValue: false }),
    createdAt: DS.attr('date', { defaultValue() { return new Date(); } })
});

And my Controller:

import Ember from 'ember';

export default Ember.Controller.extend({
    actions: {
        createBook: function(){
            var newBook = this.store.createRecord('book', {
                title: this.get('title'),
                author: this.get('author'),
                picture: this.get('picture'),
                buyer: this.get('buyer'),
                bought: this.set(false),
                createdAt: new Date().getTime()
            });
            newBook.save();
            //reset values after create
            this.setProperties({'title' : '',
                                'author' : '',
                                'picture' : '',
                                'buyer' : ''
            });

        }
    }   
});

The template:

{{outlet}}

<div style ="margin-left:130px;">
    <h1> blabla </h1>
    {{input type="text" value=title placeholder="Add Title"}}<br>
    {{input type="text" value=author placeholder="Add author"}}<br>
    {{input type="text" value=picture placeholder="Add picture"}}<br>
    {{input type="text" value=buyer placeholder="buyer"}}<br>

</div>

    <button class="btn btn-default" {{action "createBook" }}> Create</button>
    {{#each model as |book|}}
    <ul>
        <li>{{book.title}}</li>
    </ul>
    {{/each}}

The connection between the Firebase and Ember is set up 100 % properly. For now the rules on firebase have been set to true for both read and write. The only problem is that it does not post the data to Firebase.

1

There are 1 answers

1
Adrian Grzywaczewski On

Thanks @Lux for your advice. There were several things wrong with my code. I created model and controller called book, but route called books. I did not know that it will have an effect on my model and controller.

So i ended up with:

app/controllers/book.js
app/model/book.js
app/routes/book.js
app/templates/book.hbs

This was not enough. I also had to edit content of my controller

import Ember from 'ember';

export default Ember.Controller.extend({
    actions: {
        createBook: function(){
            var newBook = this.store.createRecord('book', {
                title: this.get('title'),
                author: this.get('author'),
                picture: this.get('picture'),
                buyer: this.get('buyer')
            });
            newBook.save();
            //reset values after create
            this.setProperties({'title' : '',
                                'author' : '',
                                'picture' : '',
                                'buyer' : ''
            });

        }
    }   
});

As you can see I have removed the lines that were setting the default values of bought and createdAt. It was enough just to set them inside the model itself.