How do I clear a search box with an 'x' in bootstrap 3?

Question

Having some trouble with bootstrap, so some help would be awesome. Thanks

What I would like:(top part)

Answer 1

AngularJS / UI-Bootstrap Answer

• Use Bootstrap's has-feedback class to show an icon inside the input field.
• Make sure the icon has style="cursor: pointer; pointer-events: all;"
• Use ng-click to clear the text.

JavaScript (app.js)

var app = angular.module('plunker', ['ui.bootstrap']);

app.controller('MainCtrl', function($scope) {

  $scope.params = {};

  $scope.clearText = function() {
    $scope.params.text = null;
  }

});

HTML (index.html snippet)

      

        text box
        
        
        
      

Here's the plunker: http://plnkr.co/edit/av9VFw?p=preview