To trigger the filter with a button, you need to create a custom directive.
You should not use DOM manipulation in controller. To manipulate DOM value, you could use ngModel.
<input st-search="firstName" id="firstName"
placeholder="search for firstname" class="input-sm form-control"
type="search" ng-model="firstName" />
Then change your changeSearch function to:
$scope.changeSearch = function () {
̶d̶o̶c̶u̶m̶e̶n̶t̶.̶g̶e̶t̶E̶l̶e̶m̶e̶n̶t̶B̶y̶I̶d̶(̶'̶f̶i̶r̶s̶t̶N̶a̶m̶e̶'̶)̶.̶v̶a̶l̶u̶e̶ ̶=̶ ̶'̶'̶;̶
$scope.firstName = 'Ghazanfar';
};
You still need to create custom directive to trigger the filter. Because it's the only method you can use to get the smart-table instance. (AFAIK)
Here is an example of a submit button directive.
(function() {
"use strict";
angular
.module('st-submit-search', ['smart-table'])
.directive('stSubmitSearch', function () {
return {
restrict: 'EA',
require: '^stTable', // to get smart-table as dependency
link: function(scope, element, attrs, ctrl) {
// ctrl is smart-table instance
element.bind('click', function(evt) {
scope.$apply(ctrl.pipe());
});
}
};
});
})();
And then use the directive in your view:
<button st-submit-search ng-click="changeSearch()">Change Search</button>
