How to make function that will save changes in select form and apply them on table using AngularJs
<p>I'm trying to make function that will save changes made in select form and apply them to my table.
In table I'm displaying name, designation and company of employees. I want to use select form to select the name of company. When I select company name and then click save button as result I only want to display names, designations and company of employees that work for that selected company. Also I want to display number of rows left in table after filtering the table. </p>

<p>Code I have so far is here:</p>

<p><strong>data.html</strong></p>

<pre><code>&lt;div ng-app="MyApp" ng-controller="MyController"&gt;

&lt;div&gt;
        &lt;table&gt;
        &lt;tr&gt;
            &lt;th style="width:10%"&gt;#&lt;/th&gt;
            &lt;th style="width:20%"&gt;Name&lt;/th&gt;
            &lt;th style="width:40%"&gt;Designation&lt;/th&gt;
            &lt;th style="width:30%"&gt;Company&lt;/th&gt;
        &lt;/tr&gt;
        &lt;tr ng-repeat="employee in clients | filter:searchText"&gt;
        &lt;td&gt;{{$index + 1}}&lt;/td&gt;
        &lt;td&gt;{{employee.name}}&lt;/td&gt;
        &lt;td&gt;{{employee.designation}}&lt;/td&gt;
        &lt;td&gt;{{employee.company.name}}&lt;/td&gt;
        &lt;/tr&gt;
        &lt;/table&gt;

 &lt;/div&gt;  

    &lt;div&gt;

       &lt;h2&gt;Select Company:&lt;/h2&gt;

            &lt;select ng-model="searchText.company.name"&gt;
            &lt;option ng-repeat="c in clients" value="{{c.company.name}} "&gt;{{c.company.name}}&lt;/option&gt;
            &lt;/select&gt;

            &lt;h3&gt;You selected: {{searchText.company.name}&lt;/h3&gt;

        &lt;button ng-click="updateSearch()"&gt;Save&lt;/button&gt;
        &lt;b&gt;input: {{searchText.company.name}}&lt;/b&gt;
    &lt;/div&gt;

&lt;/div&gt;
</code></pre>

<p><strong>data.js</strong></p>

<pre><code>var controllers = angular.module('MyApp', [])
        controllers.controller('MyController', function  ($scope) {


              $scope.clients = [{
                    name: 'Brett',
                    designation: 'Software Engineer',
                    company: {
                        name: 'Apple'
                    }
                }, {
                    name: 'Steven',
                    designation: 'Database Administrator',
                    company: {
                        name: 'Google'
                    }
                }, {
                    name: 'Jim',
                    designation: 'Designer',
                    company: {
                        name: 'Facebook'
                }
                }, {
                    name: 'Michael',
                    designation: 'Front-End Developer',
                    company: {
                        name: 'Apple'
                }
                }, {
                    name: 'Josh',
                    designation: 'Network Engineer',
                    company: {
                        name: 'Google'
                }
                }, {
                    name: 'Ellie',
                    designation: 'Internet Marketing Engineer',
                    company: {
                        name: 'Apple'
                }
                }];


                     $scope.updateSearch = function() {
                    console.log($scope.searchText.company.name);

    }

        });
</code></pre>

<p>Now I'm selecting company name immediately after choosing it from select form, but I want it to be applied after clicking on save button.
If anybody can help, thanks!     </p>