Como carregar 2 arquivos javascript com JSF

14 respostas
N

boa tarde, como posse carregar dois arquivos esternos no JSF 2.0?
obrigado…

14 Respostas

K

explica melhor o que vc ta querendo fazer.
:slight_smile:

M

é simples

<h:outputScript library="js" name="jquery.min.js" />
	<h:outputScript library="js" name="jquery-ui.min.js" />
N

muito obrigado pelos esclarecimentos…

M

Caso tenha resolvido seu problema.
coloca como resolvido no título.

N

entendi…
eu não sabia…
mas na verdade não resolveu…
me enganei…
porque quando importo os dois javascript o ultimo arquivo mata o primeiro…
se alguém puder me ajudar…
estou tentando trabalhar com um javascript bem genérico e outro mais específico…
obrigado…

M

Muito estranho isso.
Porque uso vários aki e nunca deu nada errado.
verfique pelo firebug se está sendo importado corretamente os arquivos.

N

seria porque estou usando facelets?
vou ver pelo firebug, apesar de não conhecer ele, vou pesquisar…
obrigado

M

Facelets é default no JSF2
então num tem nada haver não.

N

meu template está assim:

<?xml version="1.0" encoding="ISO-8859-1" ?>
<!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" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
	<h:head>
		<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
		<title>Sistema HRWMS</title>
		<h:outputStylesheet library="style" name="cabecalho.css" />
		<h:outputScript library="javascript" name="cabecalho.js" />
		<ui:insert name="css" />
		<ui:insert name="jscript"></ui:insert>
	</h:head>
	<h:body >
		<div id="divcentral">
			<div id="divcabcentral">
				<div id="divcabimagem"></div>
				<div id="divcabconteudo">
					<fieldset id="molduradados">
						<div id="divcabdados" >
							<h:outputFormat value="loja: {0} &nbsp; Usuario: {1}" styleClass="datalabels">
								<f:param value="#{usuario.loja}" />
								<f:param value="#{usuario.usuario}" />
								<div id="divcablogoff"><h:graphicImage library="imagens" name="btsair.gif" id="logoff" /></div>
							</h:outputFormat>
						</div>
					</fieldset>
				</div>
			</div>
			<div id="divsair" style="display:none;">
			<h:graphicImage library="imagens" name="imgsair.gif" id="btsair" alt="Deseja sair?" usemap="#imgsair"/>
				 <map id="imgsair" >
				 	<area id="btsairsim" shape="rect" alt="Sim" coords="146,6,179,15" />
				 	<area id="btsairnao" shape="rect" alt="Não" coords="182,3,216,14" />
				 </map>
			</div>
			<ui:insert name="content"></ui:insert>
		</div>	
	</h:body>
</html>

e a página de composição está assim:

<!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" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<ui:composition template="alpha.xhtml">
	<ui:define name="css"><h:outputStylesheet library="style" name="tarefas.css" /></ui:define>
	<ui:define name="jscript"><h:outputScript library="javascript" name="tarefas.js" /></ui:define>
	<ui:define name="content">
		<div class="divqtdependentes">
			<h:outputFormat value="Quantidades pendentes: {0}" styleClass="qtdependentesitens">
				<f:param value="#{tarefas.qtdtask}"></f:param>
			</h:outputFormat>
		</div>
		<div id="divlabens" >
			<div id="label1"><span class="labels">Tipo</span></div>
			<div id="label2"><span class="labels">Id</span></div>
			<div id="label3"><span class="labels">NF</span></div>
			<div id="label4"><span class="labels">Status</span></div> 
		</div>
		<h:dataTable value="#{tarefas.listtask}" var="task" rowClasses="listatask1,listatask2" cellpadding="1" cellspacing="1" columnClasses="listacol1,listacol2,listacol3,listacol4">
		<h:column>
			<h:outputText value="#{task.tipo}"/>
		</h:column>
		<h:column>
			<h:outputText value="#{task.id_status}" />
		</h:column>
		<h:column>
			<h:outputText value="#{task.numnf}" />
		</h:column>
		<h:column>
			<h:outputText value="#{task.status}" />
		</h:column>
		</h:dataTable>
	</ui:define>
</ui:composition>
</html>

o javascript declarado no template é ignorado…
só o de composição…

M

Muda seu ui:insert

<ui:insert name="css" /> <ui:insert name="jscript"></ui:insert>

para

<ui:insert name="CSSeJavaScript"></ui:insert>

Muda sua página também.
você não precisa criar um novo html…
é só você chamar os namespaces dentro de ui:composition

N

vc se refere a leu doctaype?
porque não entendi como posso declarar o namespace se não dentro da tag html?
assim?

<ui:composition template="alpha.xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
	<ui:define name="css"><h:outputStylesheet library="style" name="tarefas.css" /></ui:define>
	<ui:define name="jscript"><h:outputScript library="javascript" name="tarefas.js" /></ui:define>
	<ui:define name="content">
	<h:form id="form" prependId="false">
		<div class="divqtdependentes">
			<h:outputFormat value="Quantidades pendentes: {0}" styleClass="qtdependentesitens">
				<f:param value="#{tarefas.qtdtask}"></f:param>
			</h:outputFormat>
		</div>
		<div id="divlabens" >
			<div id="label1"><span class="labels">Tipo</span></div>
			<div id="label2"><span class="labels">Id</span></div>
			<div id="label3"><span class="labels">NF</span></div>
			<div id="label4"><span class="labels">Status</span></div> 
		</div>
			<h:dataTable value="#{tarefas.listtask}" var="task" rowClasses="listatask1,listatask2" cellpadding="1" cellspacing="1" columnClasses="listacol1,listacol2,listacol3,listacol4">
								<h:column>
					<h:commandLink value="#{task.indice}"></h:commandLink>
				</h:column>
				<h:column>
					<h:commandLink value="#{task.tipo}" action="#{tarefas.consultarProduto}" ></h:commandLink>
				</h:column>
				<h:column>
					<h:commandLink value="#{task.id_status}"></h:commandLink>
				</h:column>
				<h:column>
					<h:commandLink value="#{task.numnf}"></h:commandLink>
				</h:column>
				<h:column>
					<h:commandLink value="#{task.status}"></h:commandLink>
				</h:column>
			</h:dataTable>
		</h:form>
	</ui:define>
</ui:composition>

obrigado

M

Os arquivos imports da página de composição não irão funcionar pois não estão estre as tags
Tenta por esses imports no template só para teste.
e tira isso aki <ui:define name=“jscript”>, <ui:define name=“css”>
e põe só um <ui:insert name=“CSSeJavaScript”></ui:insert> no template

N

eu coloquei direto:

<?xml version="1.0" encoding="ISO-8859-1" ?>
<!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" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
	<h:head>
		<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
		<title>Sistema HRWMS</title>
		<h:outputStylesheet library="style" name="cabecalho.css" />
		<h:outputStylesheet library="style" name="tarefas.css" />
		<h:outputScript library="javascript" name="cabecalho.js" />
		<h:outputScript library="javascript" name="tarefas.js" />
	</h:head>
	<h:body >
		<div id="divcentral">
			<div id="divcabcentral">
				<div id="divcabimagem"></div>
				<div id="divcabconteudo">
					<fieldset id="molduradados">
						<div id="divcabdados" >
							<h:outputFormat value="loja: {0} &nbsp; Usuario: {1}" styleClass="datalabels">
								<f:param value="#{usuario.loja}" />
								<f:param value="#{usuario.usuario}" />
								<div id="divcablogoff"><h:graphicImage library="imagens" name="btsair.gif" id="logoff" /></div>
							</h:outputFormat>
						</div>
					</fieldset>
				</div>
			</div>
			<div id="divsair" style="display:none;">
			<h:graphicImage library="imagens" name="imgsair.gif" id="btsair" alt="Deseja sair?" usemap="#imgsair"/>
				 <map id="imgsair" >
				 	<area id="btsairsim" shape="rect" alt="Sim" coords="146,6,179,15" />
				 	<area id="btsairnao" shape="rect" alt="Não" coords="182,3,216,14" />
				 </map>
			</div>
			<ui:insert name="content"></ui:insert>
		</div>	
	</h:body>
</html>

mas mesmo assim não funcionou o javascript, css sim mas o javascript não…
será que não dá pra fazer isso?
se não der eu deixo em um arquivo só, mas gostaria de saber se é possivel, dessa forma acretido que iria reaproveitar mais meu código

e na questão do namaespace eu posso declarar daquela forma? no composition?
obrigado

M

Não só pode como se possível deve.
Pois se você sempre criar um novo html, quando o código for para o lado cliente(browser) vai ficar bem estranho na parte do código.

Criado 18 de abril de 2011
Ultima resposta 19 de abr. de 2011
Respostas 14
Participantes 3