Hide/Show Div with javascript

To display and hide DIV in html;

<div class="card-body">
   <div id="divMessage">                
        @Html.Raw(@TempData["message"]);
    </div>
    </div>  
    <div> 
       <!--need to hide this form-->         
       <form method="post" asp-antiforgery="true" id="formDiv">
          <div class="card mb-3">
             <h5 class="card-header text-white">
                  Welcome To Div Hide/Display
             </h5>
        </form>
    </div>
</div>

Use this javascript;

@section Scripts
{
  <script>
     $(document).ready(function () {
            //show/hide login sections based on SSO
            divFormSection();
        });

        function divFormSection() {
            var isDivFormVisible = '@TempData["IsDivFormVisible"]';
            if (isDivFormVisible == 'false') {
                //alert(isDivFormVisible);
                $("#formDiv").hide();
            }
        }
     }
    </script>
}

We need to pass parameters from controller in TempData;

TempData["message"] = "Form Hide/Display demo";
TempData["IsDivFormVisible"] = "false";
FavoriteLoadingAdd to favorites
Spread the love

Author: Shahzad Khan

Software developer / Architect