How to disable bootstrap controls from code behind

Question

i have a aspx page:

<div class="form-vertical">
    <div class="form-group">

        <div class="row">
            <div class="col-sm-3">
                <asp:DropDownList runat="server" ClientIDMode="Static" ID="ddlLocation" CssClass="form-control required" AppendDataBoundItems="true" DataTextField="location_name" DataValueField="location_id" OnInit="ddllocation_Init">
                    <asp:ListItem Value="" Text="Select location..">
                    </asp:ListItem>
                </asp:DropDownList>
            </div>
        </div>
        <br />

        <div class="row">
            <div class="col-sm-4">
                <button type="button" id="btnAdd" class="btn btn-success pull-center"><i class="fa fa-search"></i>Add</button>
            </div>
        </div>

    </div>

</div>

....
Some more content here that needs to be displayed.

Based on certain conditions, when the asp.net page loads, I'd like to either hide the entire div class="form-vertical" OR disable all controls

Can disable asp.net controls but how to disable button - btnAdd

Any suggestions?

Answer 1

To Hide Div: Give the div id and add runat="server" so that you can access the corresponding div from code-behind.

<div ID="myDivId" runat="server" >
  //div content
</div>

In code-behind set its visible property to false.

myDivId.Visible = false

To Disable Button: Add runat="server".

<button id="myBtn" runat="server"> clickMe </button>

In code-behind

 myBtn.Disabled = true;