AssetTracking 2 .aspcore web application dropdownlist filter

@model IEnumerable<BLL.DTOs.asset_dto>

<h2><label id="title_label">All Asset</label></h2>

<script type="text/javascript">
    function filter() {

        $('#asset_table tbody').empty();

        var asset_list = [];

        @foreach (var item in Model)
        {
         <text>
        if ($('#asset_types_viewbag').val() == @item.AssetTypeId)
        {
            asset_list.push(new asset_class('@item.Id', '@item.Model', '@item.Manufacturer', '@item.AssetType'));
    }
    </text>

        }
 

    $.each(asset_list, function (key, value) {
        $('#asset_table').append('<tr>\
              <td>' + value.id + '</td>\
              <td>' + value.model + '</td>\
              <td>' + value.manfacture + '</td>\
              <td>' + value.asset_type + '</td></tr>');
    });

    }

    function asset_class(id, model, manufacture, asset_type) {
        this.id = id;
        this.model = model;
        this.manfacture = manufacture;
        this.asset_type = asset_type;
    }
</script>

<div class="col-md-2">

    @Html.DropDownList("asset_types_viewbag", null, htmlAttributes: new { @class = "form-control", onchange = "filter()" })
</div>

<div class="col-md-10">

    <table id="asset_table" class="table table-striped">
        <thead>
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.Id)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Model)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Manufacturer)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.AssetType)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.AssignedTo)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Description)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.TagNumber)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.SerialNumber)
                </th>
            </tr>
        </thead>

        <tbody>
            @foreach (var item in Model)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.Id)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Model)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Manufacturer)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.AssetType)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.AssignedTo)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Description)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.TagNumber)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.SerialNumber)
                    </td>
                </tr>
            }
        </tbody>
    </table>
</div>

reference:

https://www.w3schools.com/jsref/met_table_insertrow.asp
http://stackoverflow.com/questions/2620181/clear-table-jquery
http://stackoverflow.com/questions/171027/add-table-row-in-jquery
https://forums.asp.net/t/1758990.aspx?How+to+get+access+to+a+list+of+Models+in+jQuery+
http://stackoverflow.com/questions/21808054/appending-jquery-selector-variable-into-a-table
http://stackoverflow.com/questions/2729323/javascript-pushing-object-into-array
https://davidwalsh.name/multiline-javascript-strings
http://stackoverflow.com/questions/23612268/how-to-select-a-drop-down-value-using-jquery
http://stackoverflow.com/questions/4029281/get-drop-down-value
http://stackoverflow.com/questions/3584145/how-to-change-the-text-of-a-label-in-jquery