Well, something strange is happening.
When the page loaded the first time, the ajax operation don't work. if I refresh the page, It works fine.
One example is when I click on a select menu option. It should close the dialog and trigger the ajax event, but It just select the option and not close. I need click twice to select, but anyway the ajax is not triggered.
This is my Full Page:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets" >
<ui:composition >
<h:head>
<title>Manager</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="/Manager/resources/jquery.mobile-1.4.0-rc.1.min.css" />
<script src="/Manager/resources/jquery-1.10.2.min.js" />
<script src="/Manager/resources/jquery.mobile-1.4.0-rc.1.min.js" />
<script type="text/javascript" >
function renderFormCss () {
$('#f_meta_cadastro_empresa').enhanceWithin();
}
</script>
<f:metadata>
<f:viewParam name="cd_meta" value="#{meta_EmpresaWEB.cd_meta}"></f:viewParam>
</f:metadata>
</h:head>
<h:body >
<div data-role="page" >
<div data-role="header" data-theme="b" class="ui-nodisc-icon" >
<a href="#" class="ui-btn ui-noboxshadow ui-icon-arrow-l ui-btn-icon-notext" data-iconshadow="false" >Menu</a>
<h1>Meta</h1>
<a href="#" class="ui-btn ui-noboxshadow ui-icon-arrow-r ui-btn-icon-notext" data-iconshadow="false" >Próximo</a>
</div>
<div role="main" class="ui-content ui-nodisc-icon ui-alt-icon" >
<h:messages id="mensagem_verificacao" showDetail="false" style="color: red;" />
<h:form id="f_meta_cadastro_empresa" >
<f:passThroughAttribute name="data-ajax" value="false" />
<h:selectManyMenu id="select_empresa" value="#{meta_EmpresaWEB.listaMeta_Empresas_Selecionadas}" converter="Meta_EmpresaConverter" >
<f:passThroughAttribute name="data-native-menu" value="false" />
<f:passThroughAttribute name="data-shadow" value="false" />
<f:passThroughAttribute name="data-corners" value="false" />
<f:selectItem itemLabel="Empresas" itemValue="#{null}" >
<f:passThroughAttribute name="data-placeholder" value="true" />
</f:selectItem>
<f:selectItems value="#{meta_EmpresaWEB.listaMeta_Empresa}" var="meta_empresa" itemLabel="#{meta_empresa.nm_empresa}" itemValue="#{meta_empresa}" />
<f:ajax execute="select_empresa" render="lista_empresas" onevent="renderFormCss" />
</h:selectManyMenu>
<h:panelGroup id="lista_empresas" layout="block" >
<ul data-role="listview" style="margin-top: 30px;" class="ui-nodisc-icon" >
<ui:repeat value="#{meta_EmpresaWEB.listaMeta_Empresas_Selecionadas}" var="meta_empresa" >
<li data-role="list-divider" style="font-weight: bold;">
<h2>#{meta_empresa.nm_empresa}</h2>
<div data-role="controlgroup" data-type='horizontal' data-mini="true" class="ui-btn-right" style="margin: 0 auto;" >
<h:selectManyMenu id="a" value="#{meta_empresa.dias_mes}" >
<f:passThroughAttribute name="data-native-menu" value="false" />
<f:passThroughAttribute name="data-shadow" value="false" />
<f:passThroughAttribute name="data-corners" value="false" />
<f:selectItem itemLabel="Dias" itemValue="#{null}" >
<f:passThroughAttribute name="data-placeholder" value="true" />
</f:selectItem>
<f:selectItems value="#{meta_EmpresaWEB.dias_Mes}" var="dia" itemLabel="#{dia}" itemValue="#{dia}" />
</h:selectManyMenu>
<a href='#' id='moreOptions' class="ui-btn ui-btn-b" style="margin-left: 5px; margin-right: 5px;" >Prêmio</a>
</div>
</li>
<li >
<h:inputText >
<f:passThroughAttribute name="placeholder" value="Vl. Meta" />
</h:inputText>
</li>
</ui:repeat>
</ul>
</h:panelGroup>
</h:form>
</div>
</div>
</h:body>
</ui:composition>
</html>
When I click and It not work, chrome console trigger this error: ReferenceError: mojarra is not defined.
Another strange thing. When I call the page, the console network doesn't change, It just add a line like that:
Any idea?
Thanks
