Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Camaradas,
Estas dicas têm por objetivo facilitar o entendimento sobre o uso de controle array´s em ASP. Não pretendo esgotar o assunto muito menos propalar dogmas.
Portanto relaxem e aproveitem.
O código a seguir cria um conjunto de controle do tipo texto INPUT a partir de um vetor (vVetor). Notem que foi criada uma string ("0,1,2,3") para depois trasformá-la em array utilizando o SPLIT. Este procedimento foi somente para criar uma massa de testes.
O exemplo a ser a serguir têm a seguinte lógica de funcionamento.
[*]Será criada uma página ASP chamada frm_dados.asp onde serão criados os controles HTMLe serão criadas funções JavaScript para manipular este controles em tempo real (online).
[*]Será criada uma página ASP chamadas res_dados.asp onde os controles da página frm_dados.asp serão recuperados e manipulados.
[*]Código Asp frm_dados.asp:
<html> <head> <script> function processa(iQtdeVetor){ if (consiste_controles(iQtdeVetor)){ document.frm.action = "res_dados.asp"; document.frm.submit(); } } function consiste_controles(iQtdeVetor){ var bmarcado = false; // //Controles NÃO É ARRAY deve ser tratado sem o indíce if (document.frm.chkItem.length == undefined){ if (!document.frm.chkItem.checked){ alert('Selecione pelo menos um item!'); document.frm.chkItem.focus(); return false; } if (document.frm.chkItem.checked && document.frm.txtDesc.value == ''){ alert('Campo de preenchimento obtigatório!'); document.frm.txtDesc.focus(); return false; } }else{ for (var i=0;i<=iQtdeVetor;i++){ if (document.frm.chkItem[i].checked){ bmarcado = true; } if (document.frm.chkItem[i].checked && document.frm.txtDesc[i].value == ''){ alert('Campo de preenchimento obtigatório!'); document.frm.txtDesc[i].focus(); return false; } } //Controles É ARRAY deve ser tratado com o indíce if (!bmarcado){ alert('Selecione pelo menos um item!'); document.frm.chkItem[i].focus(); return false; } } return true; } function marca_desmarca(opcao,iQtdeVetor){ // //Controles NÃO É ARRAY deve ser tratado sem o indíce if (document.frm.chkItem.length == undefined){ document.frm.chkItem.checked = opcao; }else{ for (var i=0;i<=iQtdeVetor;i++){ //Controles É ARRAY deve ser tratado com o indíce document.frm.chkItem[i].checked = opcao; } } } </script> </head> <body> <form name="frm" id="frm" method="post"> <table border="0"> <tr> <td colspan="2" align="center"> Selecione e justifiques os Itens </td> <tr> <% '-- '--Criando um vetor para teste vVetor = "0,1,2,3" vVetor = Split(Vvetor,",") iQtdeVetor = Ubound(vVetor) For i = 0 To iQtdeVetor%> <tr> <td> Item <%=i%>: <input type="checkbox" id="chkItem" name="chkItem" value="<%=i%>"></input> <input type="hidden" id="txtItem" name="txtItem" value="<%=i%>"></input> </td> <td> Justificativa: <input id="txtDesc" name="txtDesc"></input> </td> </tr> <%next%> <tr> <tr> <td colspan="2" align="center"> <input type="button" value="Marcar todos" id="btnMarca" onClick="javascript: marca_desmarca(true,<%=iQtdeVetor%>);" > <input type="button" value="Desmarcar todos" id="btnDesmarca" onClick="javascript: marca_desmarca(false,<%=iQtdeVetor%>);;" id=button1 name=button1> <input type="button" value="Enviar" id="btnenviar" onClick="javascript: processa(<%=iQtdeVetor%>);" > </td> <tr> </table> </form> </body> </html><html> <body> <table> <tr> <td> Campo0 <input id="txtCampo" name="txtCampo"></input> </td> </tr> <tr> <td> Campo1 <input id="txtCampo" name="txtCampo"></input> </td> </tr> <tr> <td> Campo2 <input id="txtCampo" name="txtCampo"></input> </td> </tr> </table> </body> </html>Como pode ser visto o controle txtCampo foi criado dentro de FOR e com o mesmo nome txtCampo. Quando os controle são criados dentro de loop´s com o mesmo nome automaticamente são criado como array´s tornando possível manipulá-lo através de indíces. Isto é padrão do ASP e não precisa de nenhuma configuração especial.
Atenção: caso no loop seja criado apenas um controle este não será do tipo array e sim um controle comum. Que não pode ser manipulado através de indíces. Fiquem atentos para isso porque é fonte de dor de cabeça.
[*]Código da página res_dados.asp para manipular os controles via reques.form:
<%vItensMarcado = split(Request.Form("chkItem"),",")vItens = split(Request.Form("txtItem"),",")vDesc = split(Request.Form("txtDesc"),",")'--'--Se controle não for array transforma em array para '--unificar tratamentoif not IsArray(vItensMarcado) then vItensMarcado = array(vItensMarcado) vItens = array(vItens) vDesc = array(vDesc)end if%><html> <head> <body> <form name="frm" id="frm" method="post"> <table border="0"> <tr> <td colspan="2" align="center"> Iten selecionados página frm_dados.asp </td> </tr> <% '-- '--Verifica quais checkbox´s estão marcado e imprime a Justificativa for i = 0 to ubound(vItensMarcado) for j = 0 to ubound(vItens) if trim(vItensMarcado(i)) = trim(vItens(j)) then%> <tr> <td> <%=vItensMarcado(i)%> </td> <td> <%=vDesc(j)%> </td> </tr> <%end if next next %> <tr> </table> </form> </body> </html>No exemplo acima pressupõe-se que a página foi submetida e estamos tratando o request.form. Como pode ser visto é bem simples e pode ajudar em muito no desenvolvimento. Claro como tudo neste mundo têm sua vantagens e desvantagens. Um exemplo prático seria o seguinte: um fornecedor envia vouchers (para transpostes) e o usuário deve marcar os vouvhers como recebidos. São 5000 vouchers que vem em blocos, separados tudo misturado. Criando controles tipo array a manipulação online fica muito mais rápida.
Caso não queira criar controles do tipo array a saída é concatenar um indice ao nome do controle (id="chkItem<%=i%>"), pois assim os controles são criados com controles normais.
[*]Código da frm_dados.asp criando controle Não Array:
<html> <head> <script> function processa(iQtdeVetor){ if (consiste_controles(iQtdeVetor)){ document.frm.action = "res_dados.asp"; document.frm.submit(); } } function consiste_controles(iQtdeVetor){ var bmarcado = false; // for (var i=0;i<=iQtdeVetor;i++){ //eval -> transforma uma variável em controle var controle = eval('document.frm.chkItem' + i); if (controle.checked){ bmarcado = true; controle = eval('document.frm.txtDesc' + i); if (controle.value == ''){ alert('Campo de preenchimento obtigatório!'); controle.focus(); return false; } } } // if (!bmarcado){ alert('Selecione pelo menos um item!'); return false; } return true; } function marca_desmarca(opcao,iQtdeVetor){ // // for (var i=0;i<=iQtdeVetor;i++){ var controle = eval('document.frm.chkItem' + i); controle.checked = opcao; } } </script> </head> <body> <form name="frm" id="frm" method="post"> <table border="0"> <tr> <td colspan="2" align="center"> Selecione e justifiques os Itens </td> <tr> <% '-- '--Criando um vetor para teste vVetor = "0,1,2,3" vVetor = Split(Vvetor,",") iQtdeVetor = Ubound(vVetor) For i = 0 To iQtdeVetor%> <input type="hidden" name="iQtdeVetor" id="iQtdeVetor" value="<%=iQtdeVetor%>"></input> <tr> <td> Item <%=i%>: <input type="checkbox" id="chkItem<%=i%>" name="chkItem<%=i%>" value="<%=i%>"></input> </td> <td> Justificativa: <input id="txtDesc<%=i%>" name="txtDesc<%=i%>"></input> </td> </tr> <%next%> <tr> <tr> <td colspan="2" align="center"> <input type="button" value="Marcar todos" id="btnMarca" onClick="javascript: marca_desmarca(true,<%=iQtdeVetor%>);" > <input type="button" value="Desmarcar todos" id="btnDesmarca" onClick="javascript: marca_desmarca(false,<%=iQtdeVetor%>);;" id=button1 name=button1> <input type="button" value="Enviar" id="btnenviar" onClick="javascript: processa(<%=iQtdeVetor%>);" > </td> <tr> </table> </form> </body> </html><html> <body> <form name="frm" id="frm" method="post"> <table border="0"> <tr> <td colspan="2" align="center"> Selecione e justifiques os Itens </td> <tr> <input type="hidden" name="iQtdeVetor" id="iQtdeVetor" value="3"></input> <tr> <td> Item 0: <input type="checkbox" id="chkItem0" name="chkItem0" value="0"></input> </td> <td> Justificativa: <input id="txtDesc0" name="txtDesc0"></input> </td> </tr> <tr> <td> Item 1: <input type="checkbox" id="chkItem1" name="chkItem1" value="1"></input> </td> <td> Justificativa: <input id="txtDesc1" name="txtDesc1"></input> </td> </tr> </table> </form> </body> </html>[*]**Código da res_dados.asp** para manipular os controles:
<%iQtdeVetor = Request.Form("iQtdeVetor")%><html> <head> <body> <form name="frm" id="frm" method="post"> <table border="0"> <tr> <td colspan="2" align="center"> Iten selecionados página frm_dados.asp </td> </tr> <% '-- '--Verifica quais checkbox´s estão marcado e imprime a Justificativa for i = 0 to iQtdeVetor sAux = Request.Form("chkItem" & i) if sAux <> "" then sAux = sAux & " -- " & Request.Form("txtDesc" & i)%> <tr> <td> <%=Request.Form("chkItem" & i)%> </td> <td> <%=Request.Form("txtDesc" & i)%> </td> </tr> <%end if next %> <tr> </table> </form> </body> </html>AUTOR: "Jothaz" inspirado nas várias surras que levei. http://forum.imasters.com.br/public/style_emoticons/default/blush.gif
Dúvidas, criticas, contribuições, correções e adições serão bem vindas.