Arquivo Discussoes de Programacao e Tecnologia 
Boa tarde pessoal!!!
É o seguintee…eu tenho um cadastro no meu sistema e eu preciso fazer algumas validações nelee…e quero faazer com javascript…
mas eu nao consigo pegar os valores das inputText’s com o comando:
document.getElementById(“id_do_campo”).value;
como eu consigo pegar alguem sabe??
Desde já agradeço!
<form id = "a">
<texto id = "b">
</form>
o codigo gerado disso fica algo como
<form id = "a">
<texto id = "a:b">
</form>
o texto por ser filho do form recebe o id do pai... ai colocando o prependId="false" no form não era para isso acontecer, mas comigo não esta dando certo tb =/
olha meu topico
http://guj.com.br/posts/list/225851.java
Eu acredito q assim funciona:
<h:form id="aForm">
<h:inputText id="anInput" />
</h:form>
<script type="javascript">
<[CDATA[
document.getElementById('aForm:anInput');
]]>
</script>
nao funcionou :S
eu dei um alert e ele mostrou null
ai eu puis .value no final e ele nao mostrou mais nada…nem abriu o dialog…
Se vc estiver usando Facelets use o seguinte:
<h:form id="aForm">
<h:inputText id="anInput" />
</h:form>
<script type="text/javascript">
var input = document.getElementById('aForm:anInput');
alert(input);
</script>
nao estou usando facelets
Eu fiz um teste com o primeiro código q postei e o <[CDATA[…]]> realmente ficou sobrando pois o framework o colocou lá p/ mim. Eu ñ tenho certeza d quem fez isso, se foi Facelets, JSF, ou o próprio servidor. Agora, vc ao menos testou o ultimo código q postei? Eu o executei em servidor Glassfish v3.0.1 e funcionaou perfeitamente.
nao deu certo…eu tentei todos os exemplos ai de cima…nenhuma deu certo…
se isso ajuda em alguma coisa, minha pagina é .jsp…
Mesmo JSP o código deveria funcionar. Seria um problema postar o código da sua página p/ q eu possa dar uma olhada?
tem partes estranhas no codigo rsrs…mas nem esquenta que sao testes rsrs…
<%@page contentType="text/html" pageEncoding="ISO-8859-1"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<f:subview id="conteudo_lateral_direita">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
<script type="text/javascript">
$(document).ready(function(){
$('#cadastrar').button();
$('#cadastrar').click(function(){
var nome = document.getElementById('formulario:nome_adm').value;
alert(nome);
});
$('#novo').button({ icons: {primary: 'ui-icon-document'} });
$('#editar').button({ icons: {primary: 'ui-icon-pencil'} });
$('#excluir').button({ icons: {primary: 'ui-icon-trash'} });
$('#conteudo').css('height', '880px');
$('#novo').click(function(){
var xml = "<administradora>\n\
<codigo>0</codigo>\n\
<nome>heitor</nome>\n\
<razaoSocial>razao</razaoSocial>\n\
<cnpj>12345678912345</cnpj>\n\
<rua>rua</rua>\n\
<bairro>bairro</bairro>\n\
<complemento>comlemento</complemento>\n\
<numero>62</numero>\n\
<cep>13339520</cep>\n\
<cidade>indaiatuba</cidade>\n\
<uf>SP</uf>\n\
<telefone>30160786</telefone>\n\
<ddd>19</ddd>\n\
<email>[email removido]</email>\n\
<site>site.com.br</site>\n\
<nomeResponsavel>heitor</nomeResponsavel>\n\
<telefoneResponsavel>12345678</telefoneResponsavel>\n\
<dddTelefoneResponsavel>19</dddTelefoneResponsavel>\n\
<celularResponsavel>12345678</celularResponsavel>\n\
<dddCelularResponsavel>19</dddCelularResponsavel>\n\
<nextelResponsavel>[telefone removido]</nextelResponsavel>\n\
<emailResponsavel>[email removido]</emailResponsavel>\n\
<usuarioPainel>dadasdas</usuarioPainel>\n\
<senhaPainel>dsadas</senhaPainel>\n\
<ultimoAcesso>2005-12-13 17:26:58.772 CET</ultimoAcesso>\n\
<dataCadastro>2005-12-13 17:26:58.772 CET</dataCadastro>\n\
<status>false</status>\n\
</administradora>";
$.post("Servlet", {action: "cadastrar", bean: "Administradora", param: xml});
alert("aqui");
});
});
</script>
</head>
<body>
<div id="titulo">
<h:outputText value="Listagem de Usuários" />
</div>
<h:form id="formulario">
<div id="formulario">
<h3 style="margin-top: 0px;"><h:outputText value="Informações da administradora" /></h3>
<h:panelGrid columns="2" columnClasses="colunaAdm1, colunaAdm2" width="625">
<h:outputLabel for="nome_adm" value="Nome:" />
<h:inputText id="nome_adm" value="" size="82" maxlength="50"/>
<h:outputLabel for="razao_social_adm" value="Razão Social:" />
<h:inputText id="razao_social_adm" value="" size="82" maxlength="50"/>
<h:outputLabel for="cnpj_adm" value="CNPJ:" />
<h:inputText id="cnpj_adm" value="" size="15" maxlength="14"/>
<h:outputLabel for="rua_adm" value="Rua:" />
<h:inputText id="rua_adm" value="" size="70" maxlength="50"/>
<h:outputLabel for="bairro_adm" value="Bairro:" />
<h:inputText id="bairro_adm" value="" size="70" maxlength="50"/>
<h:outputLabel for="complemento_adm" value="Complemento:" />
<h:inputText id="complemento_adm" value="" size="82" maxlength="100"/>
<h:outputLabel for="numero_adm" value="Número:" />
<h:inputText id="numero_adm" value="" size="5" maxlength="6"/>
<h:outputLabel for="cep_adm" value="CEP:" />
<h:inputText id="cep_adm" value="" size="8" maxlength="9"/>
<h:outputLabel for="cidade_adm" value="Cidade:" />
<h:inputText id="cidade_adm" value="" size="40" maxlength="40"/>
<h:outputLabel for="estado_adm" value="Estado:" />
<h:selectOneMenu id="estado_adm">
<f:selectItems value="#{usuario.estados}" />
</h:selectOneMenu>
<h:outputLabel for="telefone_adm" value="Telefone:" />
<h:inputText id="telefone_adm" value="" size="12" maxlength="20"/>
<h:outputLabel for="email_adm" value="Email:" />
<h:inputText id="email_adm" value="" size="60" maxlength="80"/>
<h:outputLabel for="site_adm" value="Site:" />
<h:inputText id="site_adm" value="" size="60" maxlength="80"/>
</h:panelGrid>
<br/>
<h3><h:outputText value="Informações do responsável" /></h3>
<h:panelGrid columns="2" columnClasses="colunaAdm1, colunaAdm2" width="625">
<h:outputLabel for="nome_resp_adm" value="Nome:" />
<h:inputText id="nome_resp_adm" value="" size="82" maxlength="40"/>
<h:outputLabel for="telefone_resp_adm" value="Telefone:" />
<h:inputText id="telefone_resp_adm" value="" size="12" maxlength="20"/>
<h:outputLabel for="celular_resp_adm" value="Celular:" />
<h:inputText id="celular_resp_adm" value="" size="12" maxlength="20"/>
<h:outputLabel for="nextel_resp_adm" value="Nextel:" />
<h:inputText id="nextel_resp_adm" value="" size="12" maxlength="20"/>
<h:outputLabel for="email_resp_adm" value="Email:" />
<h:inputText id="email_resp_adm" value="" size="60" maxlength="80"/>
</h:panelGrid>
<br/>
<h3><h:outputText value="Informações da conta de usuário" /></h3>
<h:panelGrid columns="2" columnClasses="colunaAdm1, colunaAdm2" width="625">
<h:outputLabel for="usuario_adm" value="Usuário:" />
<h:inputText id="usuario_adm" value="" size="20" maxlength="40"/>
<h:outputLabel for="senha_adm" value="Senha:" />
<h:inputSecret id="senha_adm" value="" size="20" maxlength="40"/>
<h:outputLabel for="confirmar_senha_adm" value="Confirmar senha:" />
<h:inputSecret id="confirmar_senha_adm" value="" size="20" maxlength="40"/>
</h:panelGrid>
<br/>
<br/>
<a id="cadastrar">
<h:outputText value="Cadastrar" />
</a>
</div>
</h:form>
</body>
</html>
</f:subview>
veja como esta o código fonte pelo browser… as vezes o elemento que você quer não estar herdando apena a ID do form… logo nao daria para pegar apenas com
document.getElementById(‘aForm:anInput’);
vc teria que fazer algo como…
<h:form id="aForm" prependId="false">
<h:inputText id="anInput" />
</h:form>
<script type="text/javascript">
var input = document.getElementById('anInput');
alert(input);
</script>
coloque o ( prependId=“false” ) dentro do Form e utilize o document.getElementById(‘anInput’);
eu vi o codigo fonte e as input’s estao com o id assim: conteudo:conteudo_lateral_direita:razao_social_adm
“conteudo” é uma div que eu carrega a div “conteudo_lateral_direita” que carrega esta pagina…
e eu puis isso no get element id e deu certo rs
eu vi o codigo fonte e as input’s estao com o id assim: conteudo:conteudo_lateral_direita:razao_social_adm“conteudo” é uma div que eu carrega a div “conteudo_lateral_direita” que carrega esta pagina…
e eu puis isso no get element id e deu certo rs
sim sim, isto acontece pois o JSF monta meio que uma arvore de IDs… logo os elementos filhos recebem a ID do elemento pai na sua id… ficando separado pelos “:” …
ai quando vc coloca o comando ( prependId=“false” ) o elemento pai não passa para seus filhos a sua ID
tem partes estranhas no codigo rsrs...mas nem esquenta que sao testes rsrs..<%@page contentType="text/html" pageEncoding="ISO-8859-1"%> <%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%> <%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <f:subview id="conteudo_lateral_direita"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/> <script type="text/javascript"> $(document).ready(function(){ $('#cadastrar').button(); $('#cadastrar').click(function(){ var nome = document.getElementById('formulario:nome_adm').value; alert(nome); }); $('#novo').button({ icons: {primary: 'ui-icon-document'} }); $('#editar').button({ icons: {primary: 'ui-icon-pencil'} }); $('#excluir').button({ icons: {primary: 'ui-icon-trash'} }); $('#conteudo').css('height', '880px'); $('#novo').click(function(){ var xml = "<administradora>\n\ <codigo>0</codigo>\n\ <nome>heitor</nome>\n\ <razaoSocial>razao</razaoSocial>\n\ <cnpj>12345678912345</cnpj>\n\ <rua>rua</rua>\n\ <bairro>bairro</bairro>\n\ <complemento>comlemento</complemento>\n\ <numero>62</numero>\n\ <cep>13339520</cep>\n\ <cidade>indaiatuba</cidade>\n\ <uf>SP</uf>\n\ <telefone>30160786</telefone>\n\ <ddd>19</ddd>\n\ <email>[email removido]</email>\n\ <site>site.com.br</site>\n\ <nomeResponsavel>heitor</nomeResponsavel>\n\ <telefoneResponsavel>12345678</telefoneResponsavel>\n\ <dddTelefoneResponsavel>19</dddTelefoneResponsavel>\n\ <celularResponsavel>12345678</celularResponsavel>\n\ <dddCelularResponsavel>19</dddCelularResponsavel>\n\ <nextelResponsavel>[telefone removido]</nextelResponsavel>\n\ <emailResponsavel>[email removido]</emailResponsavel>\n\ <usuarioPainel>dadasdas</usuarioPainel>\n\ <senhaPainel>dsadas</senhaPainel>\n\ <ultimoAcesso>2005-12-13 17:26:58.772 CET</ultimoAcesso>\n\ <dataCadastro>2005-12-13 17:26:58.772 CET</dataCadastro>\n\ <status>false</status>\n\ </administradora>"; $.post("Servlet", {action: "cadastrar", bean: "Administradora", param: xml}); alert("aqui"); }); }); </script> </head> <body> <div id="titulo"> <h:outputText value="Listagem de Usuários" /> </div> <h:form id="formulario"> <div id="formulario"> <h3 style="margin-top: 0px;"><h:outputText value="Informações da administradora" /></h3> <h:panelGrid columns="2" columnClasses="colunaAdm1, colunaAdm2" width="625"> <h:outputLabel for="nome_adm" value="Nome:" /> <h:inputText id="nome_adm" value="" size="82" maxlength="50"/> <h:outputLabel for="razao_social_adm" value="Razão Social:" /> <h:inputText id="razao_social_adm" value="" size="82" maxlength="50"/> <h:outputLabel for="cnpj_adm" value="CNPJ:" /> <h:inputText id="cnpj_adm" value="" size="15" maxlength="14"/> <h:outputLabel for="rua_adm" value="Rua:" /> <h:inputText id="rua_adm" value="" size="70" maxlength="50"/> <h:outputLabel for="bairro_adm" value="Bairro:" /> <h:inputText id="bairro_adm" value="" size="70" maxlength="50"/> <h:outputLabel for="complemento_adm" value="Complemento:" /> <h:inputText id="complemento_adm" value="" size="82" maxlength="100"/> <h:outputLabel for="numero_adm" value="Número:" /> <h:inputText id="numero_adm" value="" size="5" maxlength="6"/> <h:outputLabel for="cep_adm" value="CEP:" /> <h:inputText id="cep_adm" value="" size="8" maxlength="9"/> <h:outputLabel for="cidade_adm" value="Cidade:" /> <h:inputText id="cidade_adm" value="" size="40" maxlength="40"/> <h:outputLabel for="estado_adm" value="Estado:" /> <h:selectOneMenu id="estado_adm"> <f:selectItems value="#{usuario.estados}" /> </h:selectOneMenu> <h:outputLabel for="telefone_adm" value="Telefone:" /> <h:inputText id="telefone_adm" value="" size="12" maxlength="20"/> <h:outputLabel for="email_adm" value="Email:" /> <h:inputText id="email_adm" value="" size="60" maxlength="80"/> <h:outputLabel for="site_adm" value="Site:" /> <h:inputText id="site_adm" value="" size="60" maxlength="80"/> </h:panelGrid> <br/> <h3><h:outputText value="Informações do responsável" /></h3> <h:panelGrid columns="2" columnClasses="colunaAdm1, colunaAdm2" width="625"> <h:outputLabel for="nome_resp_adm" value="Nome:" /> <h:inputText id="nome_resp_adm" value="" size="82" maxlength="40"/> <h:outputLabel for="telefone_resp_adm" value="Telefone:" /> <h:inputText id="telefone_resp_adm" value="" size="12" maxlength="20"/> <h:outputLabel for="celular_resp_adm" value="Celular:" /> <h:inputText id="celular_resp_adm" value="" size="12" maxlength="20"/> <h:outputLabel for="nextel_resp_adm" value="Nextel:" /> <h:inputText id="nextel_resp_adm" value="" size="12" maxlength="20"/> <h:outputLabel for="email_resp_adm" value="Email:" /> <h:inputText id="email_resp_adm" value="" size="60" maxlength="80"/> </h:panelGrid> <br/> <h3><h:outputText value="Informações da conta de usuário" /></h3> <h:panelGrid columns="2" columnClasses="colunaAdm1, colunaAdm2" width="625"> <h:outputLabel for="usuario_adm" value="Usuário:" /> <h:inputText id="usuario_adm" value="" size="20" maxlength="40"/> <h:outputLabel for="senha_adm" value="Senha:" /> <h:inputSecret id="senha_adm" value="" size="20" maxlength="40"/> <h:outputLabel for="confirmar_senha_adm" value="Confirmar senha:" /> <h:inputSecret id="confirmar_senha_adm" value="" size="20" maxlength="40"/> </h:panelGrid> <br/> <br/> <a id="cadastrar"> <h:outputText value="Cadastrar" /> </a> </div> </h:form> </body> </html> </f:subview>
Amigo uma dica você pode usar jQuery para pegar os valores do campo da seguinte forma:
<< var nome = document.getElementById('formulario:nome_adm').value;
>> var nome = $('#formulario\\:nome_adm').val();