How to hide other row based on status DataTable?

denmark

how can i hide other status, in our system there are 4 status (Lined-up, Confirmed, Delivered and Cancelled) all i need is to hide other status except the lined up but the other status is searchable. see the image below and code.

`<div class="ContainerBanner">
    <h3 class="orders">Orders</h3>
    <table id="OrderList" class="display table table-striped" style="width:100%">
        <thead>
            <tr>
                <th class="search">Agent</th>
                <th class="search">Client</th>
                <th class="search">Contact#</th>
                <th class="search">State</th>
                <th class="search">Address</th>
                <th class="search">Date Posted</th>
                <th class="search" id="min">Delivery Date</th>
                <th class="search">Quantity</th>
                <th class="search">Status</th>
                <th class="search">Date Delivered</th>
                <th class="search">Notes</th>
                <th></th>
            </tr>
        </thead>
        <tbody></tbody>
    </table>
    @if ((Roles.IsUserInRole("Administrator")) || (Roles.IsUserInRole("Agent")) || (Roles.IsUserInRole("Sub-Agent")))
    {
        <a href="@Url.Action("add", "order")" class="btn btn-primary btn-sm"><i class="fas fa-cart-plus"></i> &nbsp;Order a Box</a>
    }
</div>`


`$(function () {
        $('#OrderList').DataTable({
            "ajax": "@Url.Action("getorderlist", "order")",
            "columns": [
                { "data": "AgentName"},
                { "data": "ClientFullName" },
                { "data": "PrimaryContact" },
                //{ "data": "State" },
                //{ "data": "City" },
                //{ "data": "Town" },
                //{ "data": "Postcode" },
                { "data": "State"},
                { "data": "Address" },
                { "data": "DatePosted" },
                { "data": "DeliveryDate" },
                { "data": "Quantity" },
                { "data": "Status" },
                { "data": "DateDelivered" },
                { "data": "Notes" },
                {
                    "render": function (data, type, full, meta) {
                        return "<button class='btn btn-primary btn-sm' onclick='edit(" + full.Id + ")'><i class='fas fa-user-edit'></i></button>"
                    }
                }


            ]
        });
    });

    function edit(id) {
        window.location.href = "@Url.Action("add", "order")?id=" + id;
    }`

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

colin

Hi @denmark ,

You can use columns.render to change the values of the ones not "Lined up".

Cheers,

Colin