# Build search box searching in your app

**URL:** <https://discuss.emberjs.com/t/build-search-box-searching-in-your-app/3230>\
**Category:** Search\
**Created:** [November 2, 2013, 6:05pm UTC](https://discuss.emberjs.com/t/build-search-box-searching-in-your-app/3230 "2013-11-02T18:05:20Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![designbygio](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/designbygio/32/5018_2.png) [@designbygio](https://discuss.emberjs.com/u/designbygio)\
**Post date:** [November 2, 2013, 6:05pm UTC](https://discuss.emberjs.com/t/build-search-box-searching-in-your-app/3230/1 "2013-11-02T18:05:20Z")

</div>

I would build an easy search box in my Notes.Application for searching though my notes. I looking in this form and in google and I there are not so many solutions. I found just two and don’t fit in my App ☹The problem is that I don’t have a general idea how to do it.

Here is my app:

```
<script type="text/x-handlebars" data-template-name="index">  
    <div class="wrap">
      <div class="bar">
      {{input type="text" class="search" placeholder="Where is my bookmark??" value=search action="query"}}

        <div class="bar-buttons">
          <button {{action "addNote"}}> NEW </button>
          <button> HOME </button>
        </div>
      </div>
      <aside>
        <h4 class="all-notes">All Notes {{length}}</h4>
          {{#each item in model}}
            <li>
              {{#link-to 'note' item}} {{item.title}} {{/link-to}}
            </li>
          {{/each}}
      </aside>
      {{outlet}}
    </div> 
</script>

```

Controller:

```
Notes.IndexController = Ember.ArrayController.extend ({
search: '',

actions:{
	query: function() {
      // the current value of the text field
      var query = this.get('search');
    },

	addNote: function () {
		this.transitionToRoute('main');
	}
}
});

```

Model:

```
Notes.Note = DS.Model.extend ({
title: DS.attr('string'),
body: DS.attr('string'),
url: DS.attr('string')

```

});

Notes.Note.FIXTURES = [ { id: 1, title: ‘hello world’, body: ‘ciao ciao ciao ciao’, url: ‘’ }, {  
id: 2, title: ‘javascript frameworks’, body: ‘Backbone.js, Ember.js, Knockout.js’, url: ‘…’

```
},
{
    id: 3,
    title: 'Find a job in Berlin',
    body: 'Monster, beralinstartupjobs.com',
    url: '...'
}
];

```

But anyway this is still hardcoded data, later will be just notes added dynamically from the user.

Any suggestion is really appreciated 🙂