# How to use ember data model to fetch data from a json file and display in template

**URL:** <https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512>\
**Category:** Uncategorized\
**Created:** [January 25, 2016, 1:00pm UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512 "2016-01-25T13:00:39Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![anaspm](https://avatars.discourse-cdn.com/v4/letter/a/ea666f/32.png) [@anaspm](https://discuss.emberjs.com/u/anaspm)\
**Post date:** [January 25, 2016, 1:00pm UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/1 "2016-01-25T13:00:39Z")

</div>

I need help in 1, how ember model is connected with model() hook in router.js 2, how we can save and retrieve data from json file using ember model. 3, where we need to specify the url of json file. 4, do I need to create a JsonAPIAdapter for it using cli.

---

<div class="post-metadata">

**Author:** ![francesconovy](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/francesconovy/32/9607_2.png) [@francesconovy](https://discuss.emberjs.com/u/francesconovy)\
**Post date:** [January 25, 2016, 3:53pm UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/2 "2016-01-25T15:53:56Z")

</div>

I guess you would just request the data via ajax (e.g. `Ember.$.getJSON('/my-data.json')`) and then push it manually into the store: [Pushing Records into the Store - Models - Ember Guides](https://guides.emberjs.com/v2.3.0/models/pushing-records-into-the-store/)

---

<div class="post-metadata">

**Author:** ![skaterdav85](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/skaterdav85/32/18291_2.png) [@skaterdav85](https://discuss.emberjs.com/u/skaterdav85)\
**Post date:** [January 27, 2016, 7:23am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/3 "2016-01-27T07:23:34Z")

</div>

Or, if you want to use ember data, override the specific `urlForXXX` method in either the application adapter or a model specific adapter.

> **[RESTAdapter - 4.6 - Ember API Documentation](https://api.emberjs.com/ember-data/release/classes/RESTAdapter)**
>
> The REST adapter allows your store to communicate with an HTTP server by transmitting JSON via XHR. Most Ember.js apps that consume a JSON API should use the REST adapter. This adapter is designed around the idea that the JSON exchanged with the...

For example, if you have a file `posts.json` in your public directory which you want returned from `store.findAll('post')`, do this:

```nohighlight
// adapters/post.js
export default ApplicationAdapter.extend({
  urlForFindAll(modelName) {
    return 'posts.json';
  }
});

```

---

<div class="post-metadata">

**Author:** ![anaspm](https://avatars.discourse-cdn.com/v4/letter/a/ea666f/32.png) [@anaspm](https://discuss.emberjs.com/u/anaspm)\
**Post date:** [January 27, 2016, 7:51am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/4 "2016-01-27T07:51:17Z")

</div>

Am getting this error

test-app@model:todo::ember441:1

test-app@model:todo::ember442:2

test-app@model:todo::ember443:3

when i used

urlForFindRecord(todo) { return ‘todos.json’; }

---

<div class="post-metadata">

**Author:** ![skaterdav85](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/skaterdav85/32/18291_2.png) [@skaterdav85](https://discuss.emberjs.com/u/skaterdav85)\
**Post date:** [January 27, 2016, 8:06am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/5 "2016-01-27T08:06:47Z")

</div>

whoops, I copied the wrong one. it should be `urlForFindAll`. I modified my original response,

---

<div class="post-metadata">

**Author:** ![anaspm](https://avatars.discourse-cdn.com/v4/letter/a/ea666f/32.png) [@anaspm](https://discuss.emberjs.com/u/anaspm)\
**Post date:** [January 27, 2016, 8:09am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/6 "2016-01-27T08:09:19Z")

</div>

I did the same . but data is not showing.

---

<div class="post-metadata">

**Author:** ![anaspm](https://avatars.discourse-cdn.com/v4/letter/a/ea666f/32.png) [@anaspm](https://discuss.emberjs.com/u/anaspm)\
**Post date:** [January 27, 2016, 8:12am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/7 "2016-01-27T08:12:41Z")

</div>

Brother I dont have previous experience in any javascript framework.

How could I learn all the functionalities of ember with a simple backend.

what is adapters used for.

how do i have to configure my ember app with any of database(I mean sample data to work).

I am using ember cli

how can i create a simple form using ember and save form data to my local.

---

<div class="post-metadata">

**Author:** ![skaterdav85](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/skaterdav85/32/18291_2.png) [@skaterdav85](https://discuss.emberjs.com/u/skaterdav85)\
**Post date:** [January 27, 2016, 8:26am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/8 "2016-01-27T08:26:19Z")

</div>

can you post on github?

---

<div class="post-metadata">

**Author:** ![anaspm](https://avatars.discourse-cdn.com/v4/letter/a/ea666f/32.png) [@anaspm](https://discuss.emberjs.com/u/anaspm)\
**Post date:** [January 27, 2016, 8:28am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/9 "2016-01-27T08:28:14Z")

</div>

I dont know how to use github

---

<div class="post-metadata">

**Author:** ![anaspm](https://avatars.discourse-cdn.com/v4/letter/a/ea666f/32.png) [@anaspm](https://discuss.emberjs.com/u/anaspm)\
**Post date:** [January 27, 2016, 10:36am UTC](https://discuss.emberjs.com/t/how-to-use-ember-data-model-to-fetch-data-from-a-json-file-and-display-in-template/9512/10 "2016-01-27T10:36:22Z")

</div>

Can I write actions inside model() hook of router

like

model() {

return $.json();

actions: {

x(): {}, y(): {}

} }
