JAVASCRIPT NÃO FUNCIONA

MORCELI 25/08/2016 20:04:56
#466194
Boa noite pessoal,
Preciso de uma luz sobre esse assunto, comecei faz pouco tempo a aprender programação web, agora cheguei em um ponto que não consigo achar nada especifico ou até achei mas não entendi como funciona. Vamos por partes:
1- Montei uma pagina web e uso cabeçalho e rodapé no mesmo e por tanto só faço refresh parcialmente na pagina não posso carregar pagina toda novamente, ai que mora o problema, comecei a usar updatepanel para carregar uma tabela na pagina parcialmente sem precisar carregar a pagina toda novamente, só que essa tabela tem uma função javascript e css para configurar o relatório como eu quero que nada mais é que é uma tabela responsiva que ajusta a tela conforme sua resolução como computador, tablete e celular. Só que quando realizo a pesquisa e carrego essa tabela que fica dentro do updatepanel o javascript perde a referência e não funciona:

2-Para carregar a tabela uso o código abaixo:
     html.Append([Ô]<table id=[Ô][Ô]myTable[Ô][Ô] class=[Ô][Ô]table demo[Ô][Ô] data-filter=[Ô][Ô]#filter[Ô][Ô] data-filter-text-only=[Ô][Ô]true[Ô][Ô]>[Ô])
html.Append([Ô]<thead>[Ô])
html.Append([Ô]<tr><th data-toggle=[Ô][Ô]true[Ô][Ô]>Produto</th>[Ô])
html.Append([Ô]<th>PLU</th>[Ô])
html.Append([Ô]<th data-hide=[Ô][Ô]phone,tablet[Ô][Ô]>Qtd</th>[Ô])
html.Append([Ô]<th data-hide=[Ô][Ô]phone,tablet[Ô][Ô]>Valor</th></tr></thead><tbody>[Ô])

For i As Integer = 0 To Tabelaview.Rows.Count - 1
html.Append([Ô]<tr>[Ô])
html.Append([Ô]<td>[Ô] & Tabelaview.Rows(i).Item(1) & [Ô]</td>[Ô])
html.Append([Ô]<td>[Ô] & Tabelaview.Rows(i).Item(2) & [Ô]</td>[Ô])
html.Append([Ô]<td>[Ô] & Tabelaview.Rows(i).Item(3) & [Ô]</td>[Ô])
html.Append([Ô]<td>[Ô] & Tabelaview.Rows(i).Item(4) & [Ô]</td>[Ô])
html.Append([Ô]</tr>[Ô])
Next
html.Append([Ô]</tbody>[Ô])
html.Append([Ô]</table>[Ô])


Me.PlaceHolder1.Controls.Add(New Literal() With { _
.Text = html.ToString() _
})


3-Na Pagina HTML eu faço assim:
<script src=[Ô]/Jquery/TableJs/footable.js[Ô]></script>
<script src=[Ô]/Jquery/TableJs/footablefilter.js[Ô]></script>
<script src=[Ô]/Jquery/TableJs/bootstrep-tab.js[Ô]></script>
<script src=[Ô]/Jquery/TableJs/demos.js[Ô]></script>

   <form id=[Ô]formTop[Ô] runat=[Ô]server[Ô]>

<div>
<asp:ScriptManager ID=[Ô]ScriptManager1[Ô] runat=[Ô]server[Ô]></asp:ScriptManager>

<asp:DropDownList ID=[Ô]DropDownList1[Ô] runat=[Ô]server[Ô]></asp:DropDownList>
<asp:DropDownList ID=[Ô]DropDownList2[Ô] runat=[Ô]server[Ô]></asp:DropDownList>

<asp:Button ID=[Ô]Button1[Ô] runat=[Ô]server[Ô] Text=[Ô]Filtro[Ô] CssClass=[Ô]btn btn-info[Ô] />

<asp:DropDownList ID=[Ô]DropDownList3[Ô] runat=[Ô]server[Ô]></asp:DropDownList>
<asp:CheckBoxList ID=[Ô]CheckBoxList1[Ô] runat=[Ô]server[Ô]></asp:CheckBoxList>


<asp:UpdatePanel ID=[Ô]UpdatePanel1[Ô] runat=[Ô]server[Ô]>

<ContentTemplate>


<asp:PlaceHolder ID=[Ô]PlaceHolder1[Ô] runat=[Ô]server[Ô]></asp:PlaceHolder>

</ContentTemplate>



<Triggers>
<asp:AsyncPostBackTrigger ControlID=[Ô]Button1[Ô] />
</Triggers>


</asp:UpdatePanel>
</div>
</form>


4- E assim conforme eu seleciono um item DropDownList e click no botão ele realiza a pesquisa e retorna as informações na tabela, só que o javascript para de funcionar
ai meu relatório fica sem os efeitos que eu quero.
Eu já pesquisei sobre o AJAX mas até agora só consegui abrir outras paginas web dentro da minha aplicação, mas não sei se ele consegue realizar uma pesquisa direto no banco de dados e retornar o resultado para minha tela.
Olhei também sobre JSON esse ai também não achei nada focado no que preciso que é pesquisar no banco de dados e retornar os resultado na minha tela.

Resumindo srsr preciso de exemplos que pesquise informações no meu banco de dados retorne para minha tela as informações sem atualizar minha pagina toda só parcialmente sem perder as referencias ao javascript e css...
KERPLUNK 25/08/2016 22:54:37
#466195
AJAX com certeza vai atender perfeitamente o que você quer, o caso é que acho que você não está sabendo usar. Como pelo visto seu conhecimento sobre programação web ainda é bem de iniciante, falar sobre WebAPI será como falar grego, você vai entender melhor com um [Ô]exemplo[Ô], certo? Bem, este aqui é um exemplo simples. Por se tratar de um exemplo bem simplificado ele traz somente uma string, mas é muito simples adaptar para que o retorno seja uma lista de dados, no caso um List<T>. Ao retornar essa lista de dados, você cria a sua tabela no javascript mesmo ao invés de fazer isso no codebehind. Por se tratar de um iniciante em programação web, eu acredito que você ainda terá muitas dúvidas, visto que posso constatar que você ainda não tem bem claro o conceito de o que roda onde. Mas não se acanhe, pergunte à vontade!
Faça seu login para responder