CODEWITHSUNDEEP
javascripthtmlcssasp.net
Evyatar
Evyatar

Reputation: 1157

Show/Hide div from code behind ASPX

I have the follow html page (With bootstrap), With button and progress as follow:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="TestLoading.WebForm1" %>


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link href="/css/bootstrap.min.css" rel="stylesheet" />
<title></title>
</head>
<body>
<form id="form1" runat="server">

<div>
 <asp:Button ID="btnSend" runat="server" OnClick="btnSend_Click" Text="Send" Width="71px" CssClass="btn btn-info" style="display: inline"/>
      <div class="progress" runat="server"  id="loadingSend">
          <div  class="progress-bar progress-bar-info progress-bar-striped active" aria-valuemax="100" aria-valuemin="0" aria-valuenow="100" role="progressbar" style="display: none">
              Loading...
          </div>
        </div>
</div>
</form>

I want to show/hide the progress bar from code behind, What I'm tried:

 private HttpWebRequest request;

 protected void btnSend_Click(object sender, EventArgs e)
    {            
        request = (HttpWebRequest)WebRequest.Create("http://localhost:65533/MyService.svc/");

        request.Method = WebRequestMethods.Http.Get;
        request.ContentType = "application/json";

        HtmlControl control = FindControl("loadingSend") as HtmlControl;
        control.Style.Add("display", "block");

        request.BeginGetResponse(new AsyncCallback(FinishWebRequest), null);
    }

    void FinishWebRequest(IAsyncResult result)
    {
        StringBuilder sb = new StringBuilder();
        request.EndGetResponse(result);

        var response = (HttpWebResponse)request.GetResponse();

        var responseString = new StreamReader(response.GetResponseStream()).ReadToEnd();

        HtmlControl control = FindControl("loadingSend") as HtmlControl;
        control.Style.Add("display", "none");
    }

But this isn't working for me, Any suggestion?

Thanks

Upvotes: 3

Views: 7765

Answers (2)

VadimB
VadimB

Reputation: 5711

What about to show your loading indicator on client side by reacting to OnClientClick button handler. 

<asp:Button ID="btnSend" runat="server" OnClick="btnSend_Click" Text="Send" OnClientClick="onBeforeSend"/>

So after executing and returning result, refreshing page you can disable it again.

Upvotes: 0

Mairaj Ahmad
Mairaj Ahmad

Reputation: 14604

You can simply make the div runat="server" and show hide in code.

<div id="divProgress" runat="server"  class="progress-bar progress-bar-info progress-bar-striped active" aria-valuemax="100" aria-valuemin="0" aria-valuenow="100" role="progressbar" style="display: none">
  Loading...
</div>

In C#

divProgress.Visible = false;

Upvotes: 2

Related Questions