ng-repeat not updating when ng-click function clicked - angularjs

Question

I have a GET function to list names, and another function that is triggered by an ng-click, that needs to update the ng-repeat where the lists of names are being at displayed by the get function. But it is not working. This is my code:
Container where the GET function displays:
<div class="container names-container" ng-controller='namesCtrl'>
<div ng-repeat='name in names.pData'>
<div class="name-box chiuv">
<p class="name-name">{{ name.name }} {{ name.last_name }}</p>
<p class="name-date">{{ name.date}}</p>
</div>
</div>
Search modal with the ng-click
<div class="output">
<input type="text" class="form-control" name="output" id="nameH" ng-model="inputName" placeholder="Search by name">
</div>
<div class="hebk"></div>
<button class="search-btn" ng-click="searchName()">SEARCH</button>
Functions
var fetch = angular.module('myapp', []);
fetch.controller('namesCtrl', ['$scope', '$http', function($scope, $http) {
$scope.getNames = function() {
$http({
method: 'get',
url: '<?= base_url(); ?>/display/getNames'
}).then(function successCallback(response) {
// Assign response to users object
$scope.names = response.data;
});
}
$scope.getNames();
$scope.searchName = function() {
$scope.names = '';
$http({
method: 'post',
data: {
name: $scope.inputName
},
url: '<?= base_url(); ?>/display/searchNames'
}).then(function successCallback(response) {
// Assign response to users object
$scope.names = [];
$scope.names = response.data;
});
}
}]);