ASP.Net MVC View Design

Question

В моем приложении мне нужно спроектировать представление (CSHTML), используя HTMLHelper или Bootstrap, как показано ниже

У меня следующие 3 раздела (Sec1, Sec2, Sec3) с 3 наборами кнопок, а именно: «Активно», «Неактивно» и «Все» во всех 3 разделах. Задача состоит в том, чтобы пользователь мог выбрать любую одну кнопку из каждого раздела, включая «Готово»

Как это возможно в MVC, я пробовал использовать приведенный ниже код с группами кнопок, но при этом не удается выбрать кнопки из всех трех разделов, выбор параметра удаляется при переходе из одного раздела в другой.

<div class="col" >
        <div class="right">

                Sec1 :
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-primary active">
                    <input type="radio" name="options" id="Drilloption1" autocomplete="off" checked> Active
                </label>
                <label class="btn btn-primary">
                    <input type="radio" name="options" id="Drilloption2" autocomplete="off"> InActive
                </label>
                <label class="btn btn-primary">
                    <input type="radio" name="options" id="Drilloption3" autocomplete="off"> All
                </label>
                <div class="custom-control custom-radio">
                    <input type="radio" class="custom-control-input" id="DrillingDone" name="defaultExampleRadios">
                    <label class="custom-control-label" for="DrillingDone">Done</label>
                </div>
            </div>
        </div>

        <div class="right">
            Sec3:
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-primary active">
                    <input type="radio" name="options" id="Compoption1" autocomplete="off" checked> Active
                </label>
                <label class="btn btn-primary">
                    <input type="radio" name="options" id="Compoption2" autocomplete="off"> InActive
                </label>
                <label class="btn btn-primary">
                    <input type="radio" name="options" id="Compoption3" autocomplete="off"> All
                </label>
                <div class="custom-control custom-radio">
                    <input type="radio" class="custom-control-input" id="CompletionDone" name="defaultExampleRadios">
                    <label class="custom-control-label" for="CompletionDone">Done</label>
                </div>
            </div>
        </div>

            <div class="right">
                Sec2
                <div class="btn-group" data-toggle="buttons">
                    <label class="btn btn-primary active">
                        <input type="radio" name="options" id="Facoption1" autocomplete="off" checked> Active
                    </label>
                    <label class="btn btn-primary">
                        <input type="radio" name="options" id="Facpoption2" autocomplete="off"> InActive
                    </label>
                    <label class="btn btn-primary">
                        <input type="radio" name="options" id="Facpoption3" autocomplete="off"> All
                    </label>
                    <div class="custom-control custom-radio">
                        <input type="radio" class="custom-control-input" id="FacDone" name="defaultExampleRadios">
                        <label class="custom-control-label" for="FacDone">Done</label>
                    </div>
                </div>
                <div>
                    Reference Date : <input type="text" />
                    <button type="button" class="btn btn-primary">Apply Filters</button>

                    @Html.Action("RigGridViewPartial")
                </div>
            </div>

        <div >




        </div>
        <div class="right">Right Bottom</div>
    </div>