Inquiridor
Aba bootstrap

Pergunta
-
Boa noite,
Estou começando com o Bootstrap e gostaria de realizar uma ação que funcionava muito bem com o componente TabConteiner do AjaxControlToolKit, que no caso era a troca de abas apenas indicando a propriedade
TabSetor.ActiveTabIndex = 0;
Isso direcionava para a tab que eu indicasse, mas agora estou utilizando o BootsTrap e o sistema de abas através do HTML
<ul class="nav nav-tabs">
<li class="active"><a href="#TabSetor" data-toggle="tab">Setor</a></li>e gostaria de saber se é possível no código C# indicar para que aba ir depois de um determinado evento.
Tenho a impressão que só com JavaScript é possível realizar isso, mas como fazer essa função e adicionar a chamada no C# passando a aba pretendida. Segue os trechos de código:
<%@ Page Title="" Language="C#" MasterPageFile="~/Patrimonio/Formularios/Site.Master" AutoEventWireup="true" CodeBehind="FormSetor.aspx.cs" Inherits="PatrimonioWeb.Patrimonio.Formularios.FormSetor" %> <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server"> <div class="conteiner"> <fieldset class="externo-border"> <legend class="externo-border">Cadastro de Setores</legend> <ul class="nav nav-tabs"> <li class="active"><a href="#TabSetor" data-toggle="tab">Setor</a></li> <li><a href="#TabPesquisar" data-toggle="tab">Pesquisar</a></li> </ul> <div class="tab-content"> <div class="tab-pane" id="TabSetor"> <asp:UpdatePanel id="UPSetor" runat="server"> <ContentTemplate> <br /> <fieldset class="interno-border"> <legend class="interno-border">Comandos</legend> <asp:ImageButton ID="ImgIncluir" runat="server" ImageUrl="~/Patrimonio/Img/salvar.png" TabIndex="1" ToolTip="Cadastrar Setor" OnClick="ImgIncluir_Click" /> <img src="/Patrimonio/Img/separador.png" class="Separador" /> <asp:ImageButton ID="ImgAtualizar" runat="server" ImageUrl="~/Patrimonio/Img/atualizar.png" TabIndex="3" ToolTip="Atualizar Setor" OnClick="ImgAtualizar_Click" /> <img src="/Patrimonio/Img/separador.png" class="Separador" /> <asp:ImageButton ID="ImgExcluir" runat="server" ImageUrl="~/Patrimonio/Img/excluir.png" TabIndex="2" ToolTip="Excluir Setor" OnClick="ImgExcluir_Click" OnClientClick="if (confirm("Deseja realmente Excluir?")) {return true;} else {return false;}" /> <img src="/Patrimonio/Img/separador.png" class="Separador" /> <asp:ImageButton ID="ImgNovo" runat="server" ImageUrl="~/Patrimonio/Img/novo.png" TabIndex="4" ToolTip="Criar Novo Setor" OnClick="ImgNovo_Click" /> <img src="/Patrimonio/Img/separador.png" class="Separador" /> <asp:ImageButton ID="ImgImprimir" runat="server" ImageUrl="~/Patrimonio/Img/imprimir.png" TabIndex="5" ToolTip="Imprimir Relatório" /> </fieldset> <br /> <fieldset class="interno-border"> <legend class="interno-border">Dados do Setor:</legend> <div class="form-group"> <div class="container-fraid"> <div class="row"> <div class="col-xs-1 col-xs-push-1"> <!--3 casas p/ direita --> <asp:Label ID="LblCodigo" runat="server" Text="Código:"></asp:Label> <asp:TextBox ID="TxtSetorCod" CssClass="form-control input-sm" TabIndex="6" runat="server" AutoPostBack="True" OnTextChanged="TxtSetorCod_TextChanged"></asp:TextBox> </div> <br /> <div class="col-xs-2 col-xs-pull-1"> <!--9 casas p/ esquerda --> <asp:Label ID="Label1" runat="server" Text="Situação:"></asp:Label> <asp:DropDownlist ID="ddlSituacao" CssClass="ddl" TabIndex="7" runat="server"> <asp:ListItem Value="A">Ativo</asp:ListItem> <asp:ListItem Value="I">Inativo</asp:ListItem> </asp:DropDownlist> </div> <div class="col-xs-2 col-xs-pull-1"> <!--9 casas p/ esquerda --> <asp:Label ID="Label10" runat="server" Text="Localização:"></asp:Label> <asp:DropDownlist ID="ddlLocalizacao" CssClass="ddl" TabIndex="8" runat="server" AutoPostBack="True" ToolTip="O setor pertence a Capital ou Interior do Estado?"> <asp:ListItem Value="S">Selecione</asp:ListItem> <asp:ListItem Value="C">Capital</asp:ListItem> <asp:ListItem Value="I">Interior</asp:ListItem> </asp:DropDownlist> </div> </div> <div class="row"> <div class="col-xs-1 col-xs-push-3"> <!--3 casas p/ direita --> <asp:Label ID="Label2" runat="server" Text="Sigla:"></asp:Label> <asp:TextBox ID="TxtSigla" CssClass="form-control input-sm" TabIndex="9" runat="server"></asp:TextBox> </div> <div class="col-xs-3 col-xs-pull-9"> <!--9 casas p/ esquerda --> <asp:Label ID="Label3" runat="server" Text="Nome:"></asp:Label> <asp:TextBox ID="TxtDescr" CssClass="form-control input-sm" TabIndex="10" runat="server"></asp:TextBox> </div> </div> </div> </div> </fieldset>
Trecho C#protected void GridSigla_SelectedIndexChanged(object sender, EventArgs e) { SetorBLL Setor = new SetorBLL(); try { Setor.habilitaBotoes(ImgIncluir, ImgExcluir, ImgAtualizar, "N"); GridViewRow row = GridSigla.SelectedRow; TxtSetorCod.Text = HttpUtility.HtmlDecode(row.Cells[1].Text); TxtSigla.Text = HttpUtility.HtmlDecode(row.Cells[2].Text); TxtDescr.Text = HttpUtility.HtmlDecode(row.Cells[3].Text); TxtMtrResp.Text = HttpUtility.HtmlDecode(row.Cells[4].Text); TxtNomeResp.Text = HttpUtility.HtmlDecode(row.Cells[5].Text); TxtCargoResp.Text = HttpUtility.HtmlDecode(row.Cells[6].Text); TxtMtrRespAnt.Text = HttpUtility.HtmlDecode(row.Cells[7].Text); TxtNomeRespAnt.Text = HttpUtility.HtmlDecode(row.Cells[8].Text); TxtCargoRespAnt.Text = HttpUtility.HtmlDecode(row.Cells[9].Text); ddlSituacao.SelectedValue = row.Cells[10].Text; ddlLocalizacao.SelectedValue = row.Cells[11].Text; //TabSetor.ActiveTabIndex = 0; } catch (Exception erro) { executa.Log(erro.Message.ToString()); } finally { Setor = null; } }
Desde já agradeço a colaboração.
Todas as Respostas
-
-
Boa tarde Gilberto,
Declarei a nova tag dessa forma:
<li class="active"><a href="#TabSetor" id="Id_Setor" name="Id_Setor" data-toggle="tab" runat="server">Setor</a></li>
e no C# tentei chamar assim:
protected void GridSigla_SelectedIndexChanged(object sender, EventArgs e) { SetorBLL Setor = new SetorBLL(); try { Setor.habilitaBotoes(ImgIncluir, ImgExcluir, ImgAtualizar, "N"); GridViewRow row = GridSigla.SelectedRow; TxtSetorCod.Text = HttpUtility.HtmlDecode(row.Cells[1].Text); TxtSigla.Text = HttpUtility.HtmlDecode(row.Cells[2].Text); TxtDescr.Text = HttpUtility.HtmlDecode(row.Cells[3].Text); TxtMtrResp.Text = HttpUtility.HtmlDecode(row.Cells[4].Text); TxtNomeResp.Text = HttpUtility.HtmlDecode(row.Cells[5].Text); TxtCargoResp.Text = HttpUtility.HtmlDecode(row.Cells[6].Text); TxtMtrRespAnt.Text = HttpUtility.HtmlDecode(row.Cells[7].Text); TxtNomeRespAnt.Text = HttpUtility.HtmlDecode(row.Cells[8].Text); TxtCargoRespAnt.Text = HttpUtility.HtmlDecode(row.Cells[9].Text); ddlSituacao.SelectedValue = row.Cells[10].Text; ddlLocalizacao.SelectedValue = row.Cells[11].Text; //TabSetor.ActiveTabIndex = 0; Id_Setor.Focus(); } catch (Exception erro) { executa.Log(erro.Message.ToString()); } finally { Setor = null; } }
e não funfou como eu queria, na verdade explicando melhor o que eu pretendo... Tenho um formulário com duas abas(Setor e PesquisarSetor) na aba PesquisarSetor tenho um gridView que é preenchido depois de uma pesquisa pelo nome do setor, sendo assim o usuário vai clicar na linha do Gridview preenchido e o registro vai popular os campos na outra aba chamada Setor(utilizando o evento SelectedIndexChanged), dessa forma depois de selecionar o registro o sistema deve preencher os dados e sair da aba Pesquisar e ir pra aba Setor.
Eu realizava isso com facilidade quando utilizava TabContainer do AjaxToolKit, mas agora com o bootstrap ainda não consegui essa façanha.
Qualquer dica agradeço.
- Editado AlmeidaSql quinta-feira, 9 de junho de 2016 21:00
-
Boa tarde, Almeida!
Neste caso você pode adicionar o runat="server" nas div que representam suas abas, por exemplo a TabSetor, e no código você exibe/ocultar de acordo com o necessário utilizando a propriedade Visible.
Ou seja ao invés de usar isso
TabSetor.ActiveTabIndex = 0;
Você usa isso
TabSetor.Visible = true;
TabPesquisar.Visible = false;
Att,
LeandroSe foi útil, marque como útil ou como resposta.