sort the imported data according to the selected option

[Asif_Jawed]

I have 2 requirements, 1st: imported all the data from the table. I want to filter the data according to the category/type selected. 2nd: I have added a search button to search for item name. I am unable to achieve these action. I have attached all my code below.

HTML Template:

<!--Fetching and displaying value from table, refer comment 1 of server script-->
<sn-record-picker field="value" table="'sys_choice'" default-query="'name=u_inventory_items'" display-field="'label'" value-field="'value'" search-fields="'label'" page-size="100" placeholder="Select category"></sn-record-picker>

<!--Search button to search the whole table data-->
<br><br>
<div class="search">
<input placeholder="Search..." type="text">
<button type="submit" ng-click="submit()">Go</button>
</div>
<br><br>

<!--Fetching and displaying value from table, refer comment 2 of server script-->
<div class="panel panel-default">
<table class="table table-striped table-hover table-bordered table-sm">
<thead>
<tr id="indexname">
<th scope="col">#</th>
<th scope="col">Item ID</th>
<th scope="col">Item Name</th>
<th scope="col">Item Type</th>
<th scope="col">Item Cost</th>
<th scope="col">Item Quantity</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="value in data.fetch">
<th scope="row">{{$index + 1}}</th>
<td>{{value.itemid}}</td>
<td>{{value.itemname}}</td>
<td>{{value.Itemtype}}</td>
<td>{{value.Itemcost}}</td>
<td class="text-center">{{value.Itemquantity}}</td>
</tr>
</tbody>
</table>
</div>

Server Script:

(function() {

  /* populate the 'data' object */

  /* e.g., data.table = $sp.getValue('table'); */

//Fetching Value from backend tabel and dispplaying; comment 2

data.fetch = [];

var glidetablencd = new GlideRecord('u_inventory_items');

glidetablencd.addActiveQuery();

glidetablencd.orderBy('u_item_type');

//glidetablencd.setLimit(10);

glidetablencd.query();

while(glidetablencd.next()){

var fetch_value= {};

fetch_value.itemid = glidetablencd.getValue('u_number');

fetch_value.itemname = glidetablencd.getValue('u_item_name');

fetch_value.Itemtype = glidetablencd.getValue('u_item_type');

fetch_value.Itemcost = glidetablencd.getValue('u_unit_cost');

fetch_value.Itemquantity = glidetablencd.getValue('u_quantity');

data.fetch.push(fetch_value);

}

})();