CODEWITHSUNDEEP
htmlcsstwitter-bootstrap-3
josh_boaz
josh_boaz

Reputation: 2023

bootstrap create textarea and two buttons inline

i need to create textarea and buttons like below using bootstrap inline form, or any other way below layout, i have tried below code, but it doesn't seem to work

<div class="form-inline">
                                <div class="form-group">
                                    <textarea class="form-control input-sm" rows="3" style="resize: none" ng-model="formData_EventDetails.serviceNowStr" id="serviceNowStr" readonly placeholder=""></textarea>
                                    <button class="uk-button primary " ng-click="viewServiceNowPopup(formData_EventDetails)" style="display: inline" > &nbsp;View &nbsp;</button>
                                    <button class="uk-button primary " ng-click="openServiceNowPopup(formData_EventDetails)" style="display: inline; margin-top: 5px" > Search </button>

                            </div>
                        </div>

enter image description here

Upvotes: 0

Views: 1923

Answers (2)

Heidar J. Fadhil
Heidar J. Fadhil

Reputation: 1

<div class="form-inline">
    <div class="form-group">
        <textarea class="form-control input-sm" rows="3" style="resize: none" ng- 
         model="formData_EventDetails.serviceNowStr" id="serviceNowStr" readonly 
         placeholder=""></textarea>
    </div>
   <div>
       <button class="uk-button primary " ng- 
       click="viewServiceNowPopup(formData_EventDetails)" style="display: inline" > 
       &nbsp;View &nbsp;</button>
       <button class="uk-button primary " ng- 
       click="openServiceNowPopup(formData_EventDetails)" style="display: inline; 
       margin-top: 5px" > Search </button>
   </div>

Upvotes: 0

Ismail Farooq
Ismail Farooq

Reputation: 6837

use bootstrap form horizontal to do this

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<div class="form-horizontal">
  <div class="form-group">
    <div class="col-xs-10">
      <textarea class="form-control input-sm" rows="3" style="resize: none" ng-model="formData_EventDetails.serviceNowStr" id="serviceNowStr" readonly placeholder=""></textarea>
    </div>
    <div class="col-xs-2">

      <button class="btn uk-button btn-block btn-default " ng-click="viewServiceNowPopup(formData_EventDetails)"> &nbsp;View &nbsp;</button>
      <button class="btn uk-button btn-block btn-primary " ng-click="openServiceNowPopup(formData_EventDetails)"> Search </button>

    </div>

  </div>
</div>

see here

Upvotes: 1

Related Questions