javascript - how to use bootstrap to align dropdown in angularjs application? -
i new bootstrap , have no clue how work it. have following code in html.i have compass_twitter_bootstrap in project.
<div class="well"> <h3>all adventures</h3> <table> <tr><td> <select name="" id="" ng-model="category" ng-options="c c in categories"> <option value="">-- choose category --</option> </select> </td> <td><google-places location=location></google-places></td> </tr> <tr> <td> </td> <td><select name="" id="" ng-model="tmode" ng-options="tm tm in tmodes"> <option value="">-- choose transportation mode --</option> </select></td> </tr> </table> <br/> <div ng-model="adventures"></div> <div ng-model="foods"></div> <div ng-model="arts"></div> <div ng-model="histories"></div> <div ng-model="fitness"></div> <div ng-model="parks"></div> <div ng-model="photos"></div> <div ng-model="scavenger"></div> <div ng-model="shopping"></div> <div ng-model="sightseeing"></div> <div ng-model="specialevents"></div> <div ng-model="ghosts"></div> <div ng-model="others"></div> </div> <ul class="unstyled"> <li ng-repeat="tour in tours"> <div class="well"> <h4>{{tour.name}}</h4> <a href="#/maps"><h5><em>{{tour.author}}</em></h5></a> <p>{{tour.category}}</p> <p>{{tour.createdate}}</p> <p>{{tour.dislikes}}% disliked it</p> <p>{{tour.duration}} minutes</p> <p>{{tour.likes}}% liked it</p> <h5><p>{{tour.stops.name0}}</p></h5> <h5><p>{{tour.stops.name1}}</p></h5> <h5><p>{{tour.stops.name2}}</p></h5> <h5><p>{{tour.stops.name3}}</p></h5> <p>{{tour.transportmode}}</p> </div> </li> </ul> i have 2 drop down boxes seen in attached image. can give me suggestion how how can use bootstrap , align dropdown boxes , input text box in ui?.

you using <table> if want fields inline, need include fields in same row of table, this:
<table> <tr> <td> <select name="" id="" ng-model="category" ng-options="c c in categories"> <option value="">-- choose category --</option> </select> </td> <td> <google-places location=location></google-places> </td> <td> <select name="" id="" ng-model="tmode" ng-options="tm tm in tmodes"> <option value="">-- choose transportation mode --</option> </select> </td> </tr> </table> this same html page - it's not directly related bootstrap nor angularjs
Comments
Post a Comment