Some issues with search bar within and outside of navbar

ionic-v1
1

Im following this tutorial, but am unable to fit the search bar into the navbar alone, doesnt fit with other navbar buttons as well.

Arrangement of my page html.

  <ion-view>
      <ion-nav buttons side='left'> <!-- for left buttons -->
       <ion-nav buttons side='right'> <!-- for right buttons -->
       <div class> rest of content..</div>
     </ion-view>

index.thml page for ionic

  <body animation="slide-left-right-ios7"> 
    <ion-nav-bar class="bar-light nav-title-slide-ios7"></ion-nav-bar>
    <ion-nav-view></ion-nav-view>

Even if I remove all navbar contents including the buttons, the search nar does not appear inside the navbar.

  1. If i try the method putting search within nav bar, my nav bar just clears itself (i.e nothing on it, no buttons, no logout etc) and the search bar appears below the nav bar as a blank row.

  1. If i put it as below nav bar, somehow the scrolling list start point shifts all the way to the top of the list and gets covered by the blank nav bar.