# Making an advanced search with ember

**URL:** <https://discuss.emberjs.com/t/making-an-advanced-search-with-ember/6301>\
**Category:** Ember Data\
**Created:** [September 20, 2014, 11:06am UTC](https://discuss.emberjs.com/t/making-an-advanced-search-with-ember/6301 "2014-09-20T11:06:39Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Wayne\_Douglas](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/wayne_douglas/32/9568_2.png) [@Wayne\_Douglas](https://discuss.emberjs.com/u/Wayne_Douglas)\
**Post date:** [September 20, 2014, 11:06am UTC](https://discuss.emberjs.com/t/making-an-advanced-search-with-ember/6301/1 "2014-09-20T11:06:39Z")

</div>

Hi

I am prototyping a new feature for our site [alpha.sonatribe.com](http://alpha.sonatribe.com) - we want to improve the lineup feature for when users are looking at an event and want to browse through the artists.

Looking though the docs and reading up on a lot of tutorials I can see how to call my API and pull back an initial set of results.

I have now hit a couple of stumbling blocks where by I want to construct the query string used to query the API as it uses a format like:

?filters=name:_,artists.tags:electronic|house|jungle,location.name:other_,usersAttending.usernames:_&Query=_&Skip=0&Take=10&orderBy=-popularity

I have documented most of the params here: [http://conversations.sonatribe.com/t/sonatribe-lineups-api/23](http://conversations.sonatribe.com/t/sonatribe-lineups-api/23)

I am guessing that using ember-data isn’t going to be the one here as it is very opinionated and very REST/CRUD? I hope I am wrong here but looking at my URLs and looking at how ember-data assumes it will query for things I get the feeling it’s not really made for this sort of querying?

Also, at the moment the data is initialized in the route:

```
export default Ember.Route.extend({
  model: function(){
    var store = this.store;
    return store.find('lineup', { filters: "location.name:pyra*", skip: 0, take:10});
  }
});

```

You can see I am using ember-data here and having to do weird stuff to get the query correct.

Anyway - I am also stuck trying to figure out how I wire it up so that when the user types in the search box I can request the data from the API?

I think part of the problem is that ember does a lot more for me that I was expecting so a lot of it feels like magic and I end up trying to over complicate the issue - I have spent a good amount of time reading up on this and trying to understand it as well as watching various videos but I think my use case is a little left field?

---

<div class="post-metadata">

**Author:** ![vicente](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/vicente/32/9849_2.png) [@vicente](https://discuss.emberjs.com/u/vicente)\
**Post date:** [September 22, 2014, 4:36am UTC](https://discuss.emberjs.com/t/making-an-advanced-search-with-ember/6301/2 "2014-09-22T04:36:27Z")

</div>

Hi @Wayne_Douglas,

Give Query Params a shot, they come _very very_ in handy to implement search features and persist the state in the URL.

A few weeks ago I spent some time playing with them. I implemented exactly what you are looking for: a type as you search (on the server side). Please, find on [vicentereig/hola-apps](https://github.com/vicentereig/hola-apps/tree/master/app/assets/javascripts/application) the source. Also deployed to Heroku: [http://hola-apps.herokuapp.com/apps/search?term=new%20relic](http://hola-apps.herokuapp.com/apps/search?term=new%20relic)

I’m not using a debounced event, but spawning a request per character and canceling all the pending requests. I found this snippet somewhere on the Internets and copy and pasted into my Store: [https://github.com/vicentereig/hola-apps/blob/master/app/assets/javascripts/application/store.js#L8-L15](https://github.com/vicentereig/hola-apps/blob/master/app/assets/javascripts/application/store.js#L8-L15)

_animated GIF below_

As a side-note, I implemented as [close as possible](https://github.com/vicentereig/hola-apps/tree/master/app/assets/javascripts/ng_application) same functionality in AngularJS. It was fun to implement a similar [Store in Angular](https://github.com/vicentereig/hola-apps/blob/master/app/assets/javascripts/ng_application/lib/data_store.js.). Also the [same app](http://hola-apps.herokuapp.com/ng_application), using same server-side API in Angular.

But, again, [Ember Query Params](http://emberjs.com/guides/routing/query-params/) are an excellent and nothing compares to Ember Router.

Any questions, do not hesitate dropping them here.

Cheers, Vicente.