Usuário com melhor resposta
abrir Div como um loader para bloquear tela

Pergunta
-
boa tarde ,pessoal gostaria de uma ajuda tenho uma pagina onde executo o update em uma tabela de acordo com o filtro selecionado mas devido ao grande numero de registros para não travar o browser e o usuario ficar sem saber de nada .coloquei uma </div> com runat=server e visible=false a ideia é enquando meu for tiver sendo executado eu mostro a div depois oculto mas não esta acontecendo isto segue meu codigo
<div id="Div1" class="Div_Modal" runat="server" visible="false" >
<p style="text-align: center; background-color: #FFF; height: 500px; font-size:20px; width: 100%; border: 1px solid #000;
margin: -12% 0 0 0; position: absolute">
Atualizando Dados Aguarde ...
<br />
<asp:Image runat="server" ID="LOAD" ImageUrl="~/Imagens/Load.gif" Width="12%" BorderColor="Black" /><br />
</p>
<br />
<%--<a href="#" onclick="document.getElementById('Div1').style.display='none';">[Fechar]</a>--%>
</div>code Behind:
//VERIFICO SE FOI SELECIONADO ALGUM ITEM OU NÃO
//2012/05/18
// ALEXANDRE
if (Convert.ToInt16(ddltomaracao.SelectedIndex) == 0)
{
JSAlert("Nemhuma Ação Selecionada!!");
}
else
{
Div1.Visible = true;
for (int i = 0; i < grdvalidade.Items.Count; i++)
{
CheckBox chk_A = (CheckBox)grdvalidade.Items[i].FindControl("chkselecao");
if (chk_A.Checked == true)
{
Label lblcdite = (Label)grdvalidade.Items[i].FindControl("lblcdite");
HiddenField hdlote = (HiddenField)grdvalidade.Items[i].FindControl("hdlote");
HiddenField hdseqlote = (HiddenField)grdvalidade.Items[i].FindControl("hdseqlote");
HiddenField hddtrec = (HiddenField)grdvalidade.Items[i].FindControl("hddtrec");
HiddenField hduser = (HiddenField)grdvalidade.Items[i].FindControl("hduser");
HiddenField hddtval = (HiddenField)grdvalidade.Items[i].FindControl("hddtval");
ins.Clear();
ins.Append(" UPDATE CA_CTRL_VALIDADE SET DT_VAL='" + Retorna_Data_Validade(hddtrec.Value) + "',tmp_val=" + tmp_val + ",idacao='" + ddltomaracao.SelectedValue + "',dsacao='" + ddltomaracao.SelectedItem + "' ");
ins.AppendFormat(" where lote='{0}' and seqlote='{1}' ", hdlote.Value.Substring(0, 5), hdseqlote.Value);
bool insok = obj.SU_EXEC(ins.ToString());
if (insok == true)
{
image1.Visible = true;
image2.Visible = false;
lblresultado1.Visible = true;
}
else
{
image1.Visible = false;
image2.Visible = true;
lblresultado.Visible = true;
}
}
}
txtitem.Text = string.Empty;
txtlote.Text = string.Empty;
DataTable dt_data = ConsultaData.GetInstance().LISTA_CTRL_VALIDADE(txtitem.Text, txtlote.Text.Trim(), txtdtaini.Text, txtdtafim.Text, Convert.ToInt16(ddltomaracao.SelectedValue));
grdvalidade.DataSource = dt_data;
grdvalidade.DataBind();
Habilita_Desabilita_check();
chkseltodos.Checked = false;
lbltotal.Text = "Total de Registros: " + dt_data.Rows.Count;
}
Respostas
-
bom dia valeu pela ajuda ,consegui resolver da seguinte forma criei 2 div uma para fundo e outra onde coloquei o gif depois via javascript que executa tudo do lado do Client eu mostro as divs ai depois o que esta dentro o click do meu botão testei e funfo
- Marcado como Resposta Alexandre Carvalho Marques quarta-feira, 30 de maio de 2012 11:49
Todas as Respostas
-
Você pode usar o componete UpdateProgress do Ajax, veja este exemplo:
.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> .hide { display: none; } .show { display: inherit; } .progressBackgroundFilter { background-color: #000; bottom: 0px; filter: alpha(opacity=50); left: 0px; margin: 0; opacity: 0.5; overflow: hidden; padding: 0; position: fixed; right: 0px; top: 0px; z-index: 1000; } .processMessage { background-color: #fff; color: #000066; font-family: Verdana; font-size: 12px; font-weight: normal; left: 43%; padding: 10px; position: absolute; top: 43%; width: 140px; z-index: 1001; } </style> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <asp:UpdateProgress ID="updPrgsBaselineTab" runat="server"> <ProgressTemplate> <div class="progressBackgroundFilter"> </div> <div class="processMessage"> <table width="100%"> <tr style="width: 100%"> <td style="width: 100%"> <asp:Label ID="lblProgressU" runat="server" ForeColor="Black" Text=" Por favor, aguarde..." Width="136px"></asp:Label> </td> </tr> </table> </div> </ProgressTemplate> </asp:UpdateProgress> <asp:UpdatePanel runat="server"> <ContentTemplate> <asp:Button Text="Testar" ID="btnTeste" runat="server" OnClick="btnTeste_Click" /> </ContentTemplate> </asp:UpdatePanel> </form> </body> </html>
.cs
using System; using System.Data; using System.Linq; using System.Collections.Generic; using System.Web.UI.WebControls; namespace WebApplication1 { public class Produto { public string ProductID { get; set; } } public partial class WebForm1 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void btnTeste_Click(object sender, EventArgs e) { System.Threading.Thread.Sleep(10000); } } }
Vitor Mendes | Seu feedback é muito importante para todos!
Visite o meu site: http://www.vitormendes.com.br/ -
Dê uma olhada neste artigo, poderá te ajudar.
http://www.ecode10.com/artigo/1464/Popup+em+destaque.aspx
Espero ter ajudado. Se ajudei, favor marcar no fórum falando que foi útil.
Mauricio Junior - Comunidade www.ecode10.com -
boa noite ,valeu pela ajuda mas já tentei com ModalPopupExtender().utilizando meu mesmo codigo enquanto o sistema estiver processando o for e atualizando meus dados gostaria de bloquear a tela mas quando chama o ModalPopupExtender.Show() no click do botao o sistema primeiro processa o for e depois manda a tela.por isso alterei para Div.a ideia seria o sistema bloquear a tela enquanto processa o update e depois dou Hide() no modal.mas não funcionou.
code Behind:
//VERIFICO SE FOI SELECIONADO ALGUM ITEM OU NÃO
//2012/05/18
// ALEXANDRE
ModalPopupExtender.Show()
if (Convert.ToInt16(ddltomaracao.SelectedIndex) == 0)
{
JSAlert("Nemhuma Ação Selecionada!!");
}
else
{
Div1.Visible = true;
for (int i = 0; i < grdvalidade.Items.Count; i++)
{
CheckBox chk_A = (CheckBox)grdvalidade.Items[i].FindControl("chkselecao");
if (chk_A.Checked == true)
{
Label lblcdite = (Label)grdvalidade.Items[i].FindControl("lblcdite");
HiddenField hdlote = (HiddenField)grdvalidade.Items[i].FindControl("hdlote");
HiddenField hdseqlote = (HiddenField)grdvalidade.Items[i].FindControl("hdseqlote");
HiddenField hddtrec = (HiddenField)grdvalidade.Items[i].FindControl("hddtrec");
HiddenField hduser = (HiddenField)grdvalidade.Items[i].FindControl("hduser");
HiddenField hddtval = (HiddenField)grdvalidade.Items[i].FindControl("hddtval");
ins.Clear();
ins.Append(" UPDATE CA_CTRL_VALIDADE SET DT_VAL='" + Retorna_Data_Validade(hddtrec.Value) + "',tmp_val=" + tmp_val + ",idacao='" + ddltomaracao.SelectedValue + "',dsacao='" + ddltomaracao.SelectedItem + "' ");
ins.AppendFormat(" where lote='{0}' and seqlote='{1}' ", hdlote.Value.Substring(0, 5), hdseqlote.Value);
bool insok = obj.SU_EXEC(ins.ToString());
if (insok == true)
{
image1.Visible = true;
image2.Visible = false;
lblresultado1.Visible = true;
}
else
{
image1.Visible = false;
image2.Visible = true;
lblresultado.Visible = true;
}
}
}
txtitem.Text = string.Empty;
txtlote.Text = string.Empty;
DataTable dt_data = ConsultaData.GetInstance().LISTA_CTRL_VALIDADE(txtitem.Text, txtlote.Text.Trim(), txtdtaini.Text, txtdtafim.Text, Convert.ToInt16(ddltomaracao.SelectedValue));
grdvalidade.DataSource = dt_data;
grdvalidade.DataBind();
Habilita_Desabilita_check();
chkseltodos.Checked = false;
lbltotal.Text = "Total de Registros: " + dt_data.Rows.Count;
} -
bom dia ,valeu pela ajuda fiz desta forma mas encontrei o seguinte problema dentro do click deste botao eu tenho minha rotina de update dos dados ,adicionei o meu botao btnexecutar dentro do UpdatePanel mas só é executado a tela modal meu codigo C# não se eu retirar ele de dentro do UpdatePanel ele executa meu codigo C# mas não chama a tela modal.segue meu codigo este foi só um exemplo que criei era para mostra primeiro a Tela modal depois o alerta .
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title>
</head> <body> <form id="form1" runat="server">
<asp:ScriptManager ID="Scriptmanager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate><asp:ImageButton ID="btnexecutar" runat="server" ImageUrl="~/Imagens/executar.PNG"
OnClick="btnexecutar_click" /> <asp:Button ID="Button2" runat="server" Text="[Mostrar]" OnClick="Button2_Click" />
<asp:UpdateProgress runat="server" ID="UpdateProgress1">
<ProgressTemplate>
<div id="progressBackgroundFilter" runat="server" visible="true">
</div>
<div id="Div1" class="Div_Modal" runat="server">
<p style="text-align: center; background-color: #FFF; height: 400px; font-size: 20px;
width: 100%; border: 1px solid #000; margin: -12% 0 0 0; position: absolute">
Atualizando Dados Aguarde ...
<br />
<asp:Image runat="server" ID="LOAD" ImageUrl="~/Imagens/Load.gif" Width="12%" BorderColor="Black" /><br />
</p>
<br />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel></form> </body> </html>
.cs
protected void btnexecutar_click(object sender, EventArgs e)
{
StringBuilder ins = new StringBuilder();
//VERIFICO SE FOI SELECIONADO ALGUM ITEM OU NÃO
//2012/05/18
// ALEXANDRE
Int32 tempo = 1000;
System.Threading.Thread.Sleep(tempo);
if (Convert.ToInt16(ddltomaracao.SelectedIndex) == 0)
{
JSAlert("Nemhuma Ação Selecionada!!");
}}
- Editado Alexandre Carvalho Marques quinta-feira, 24 de maio de 2012 14:44
-
bom dia valeu pela ajuda ,consegui resolver da seguinte forma criei 2 div uma para fundo e outra onde coloquei o gif depois via javascript que executa tudo do lado do Client eu mostro as divs ai depois o que esta dentro o click do meu botão testei e funfo
- Marcado como Resposta Alexandre Carvalho Marques quarta-feira, 30 de maio de 2012 11:49