hx:ajaxRefreshSubmit doesn't work in Firefox, Chrome

Question

I am using IBM JSF 1.2. This is snippet of main jsp page:

<hx:panelBox rendered="#{pc_DispositionDOTVC.forEdit.type ne pc_DispositionDOTVC.VIEW}">
    <h:outputLabel styleClass="outputLabel" for="selectCargoWarehouse" value="#{msg.lblWarehouse}" />
    <h:selectOneMenu id="selectCargoWarehouse" styleClass="selectOneMenu" required="true"
    value="#{pc_DispositionDOTVC.forEditCargo.cargo.warehouse.warehouseName}">
    <f:selectItems value="#{selectItemsFactory.warehousesByCompanyTerminalSpecial}" />
    </h:selectOneMenu>
    <h:message styleClass="message" for="selectCargoWarehouse" />
    <hx:commandExButton type="submit" styleClass="commandExButton" value="#{msg.buttonAttachNewCargo}" id="cargoButtonAdd">                                 
    <hx:behavior event="onclick" behaviorAction="get;show" onActionFunction="openDialog()" id="cargoBehaviorAdd"
        targetAction="addCargoDialog;addCargoDialog" /></hx:panelBox>
<hx:panelBox id="helpBox2">
<hx:ajaxRefreshSubmit id="ajaxRefreshSubmitCargo" target="helpBox2" />
</hx:panelBox> <%-- insert new cargo --%>
<jsp:include page="addCargoFromWarehouseDialog.jsp" />

And this is dialog jsp page (addCargoFromWarehouseDialog.jsp):

<%@page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@taglib uri="http://www.ibm.com/jsf/html_extended" prefix="hx"%>


<%-- insert new cargo --%>
<hx:panelDialog type="modal" id="addCargoDialog"    styleClass="panelDialog" showTitleCloseButton="false"
 onshow="openDialog()" onhide="closeDialog()" noKeybindings="true"  title="#{msg.buttonAttachNewCargo}">
 <h:panelGroup style="display:block; height:400px; overflow-y:scroll; overflow-x:hidden;" >
<h:panelGrid id="addCargoGrid1" styleClass="panelGrid">
<h:outputText id="cargoText01" styleClass="outputText" value="#{pc_DispositionEditCargoDialog.incomingCargosByWarehouseNameAndCargoCompany}"></h:outputText>
    <hx:dataTableEx border="0" cellpadding="2" cellspacing="0" columnClasses="columnClass" headerClass="headerClass"
        footerClass="footerClass" rowClasses="rowClass1, rowClass2" id="addCargoTable1"
        rendered="#{!empty pc_DispositionEditCargoDialog.incomingCargosByWarehouseNameAndCargoCompany}"
        value="#{pc_DispositionEditCargoDialog.incomingCargosByWarehouseNameAndCargoCompany}"
        styleClass="dataTableEx2" var="freeCargo">
        <hx:columnEx id="cargoColumnEx1">
            <f:facet name="header">
                <h:outputText id="cargoText01" styleClass="outputText" value="#{msg.lblCargoId}"></h:outputText>
            </f:facet>
            <h:outputText id="cargoDynText01" styleClass="outputText" value="#{freeCargo.cargoId}"></h:outputText>
        </hx:columnEx>
        <hx:columnEx id="cargoColumnEx41">
            <f:facet name="header">
                <h:outputText id="cargoText041" styleClass="outputText" value="#{msg.lblDispositionWeightOfGoods}"></h:outputText>
            </f:facet>
            <h:outputText id="cargoDynText041" styleClass="outputText" value="#{freeCargo.availableWeightOfGoods}">
                <hx:convertNumber maxFractionDigits="2" type="number" pattern="#,###,###,###,##0.00" />
            </h:outputText>
        </hx:columnEx>
        <hx:columnEx id="cargoColumnEx5">
            <f:facet name="header">
            </f:facet>
            <h:panelGroup id="addCargoGroup1" styleClass="buttonGroup"> 
                <h:commandLink id="saveCargoLink1" immediate="true" styleClass="positive"
                    action="#{pc_DispositionEditCargoDialog.addDispositionCargo}" value="#{msg.buttonAddCargo}">
                    <f:param id="paramCargoId" name="cargoId" value="#{freeCargo.cargoId}"/>
                </h:commandLink>                                                            
            </h:panelGroup>
        </hx:columnEx>  
    </hx:dataTableEx>
</h:panelGrid>
</h:panelGroup>
<h:panelGroup id="addCargoGroup2" styleClass="buttonGroup">                                         
    <hx:commandExButton id="buttonCancelCargoAdd" immediate="true" styleClass="negative" value="#{msg.buttonCancel}"
        action="#{pc_DispositionEditCargoDialog.clearCargos}" type="submit">
        <hx:behavior event="onclick" behaviorAction="get;hide"
            id="cargoBehavior2"
            targetAction="subview1:panelForm:helpBox2;subview1:panelForm:addCargoDialog">
        </hx:behavior>
    </hx:commandExButton>
</h:panelGroup>

</hx:panelDialog>

<hx:ajaxRefreshSubmit id="ajaxRefreshSubmitCargo2"  target="addCargoDialog" />
<%-- / insert new cargo --%>

I have a combobox to select warehouse and button to open dialog and select cargo from cargo list of available cargos from the warehouse.
When I select warehouse which has cargos and select add cargo button, the list of cargos appear.
When I select warehouse, which has no cargos, it opens an empty dialog (which is ok). But selecting the warehouse, which has cargo, again, I get en empty list(which is not ok). If I click browser refresh button than list of cargos appears normally.
This only happens in Mozilla Firefox and Chrome, in IE 11 it works fine.
It seems to me that jsf ajaxRefreshSubmit is not working properly.
Please take a look, any kind of help is very much appreciated.

Thanks in advance,
mismas

[EDIT1]: There is nothing abnormal in the web console or firebug (when I click F12)
This is the response which I get in both cases (200 POST http://localhost:8080/ExtComConWeb/pages/secure/disposition/dispositionDOTVC.faces?%24%24ajaxid=subview1%3ApanelForm%3AaddCargoDialog&%24%24ajaxmode=axfull):

<div id="subview1:panelForm:addCargoDialog" class="panelDialog"  style="position:absolute; display:none;"><div  id="subview1:panelForm:addCargoDialog_tb" title="Dodaj teret">Dodaj  teret</div><div id="subview1:panelForm:addCargoDialog_ca"><span  style="display:block; height:400px; overflow-y:scroll; overflow-x:hidden;"> <table id="subview1:panelForm:addCargoGrid1" class="panelGrid">
<tbody>
<tr>
<td><span id="subview1:panelForm:cargoText01" class="outputText">  [hr.combis.comcon.persistency.hibernate.impl.crg.Cargo@58996c54,  hr.combis.comcon.persistency.hibernate.impl.crg.Cargo@2468c3d]</span></td>
</tr>
<tr>
<td><table id="subview1:panelForm:addCargoTable1" class="dataTableEx2"  border="0" cellpadding="2" cellspacing="0" ><thead ><tr ><th  class="headerClass" scope="col" ><span  id="subview1:panelForm:addCargoTable1:cargoText01" class="outputText">Broj tereta</span></th><th class="headerClass" scope="col" ><span class="outputText">K447</span></th><th class="headerClass" scope="col"  ><span class="outputText">JCD</span></th><th class="headerClass" scope="col" ><span class="outputText">MRN</span></th><th class="headerClass" scope="col" ><span id="subview1:panelForm:addCargoTable1:cargoText02" class="outputText">Standardni opis tereta</span></th><th class="headerClass" scope="col" ><span id="subview1:panelForm:addCargoTable1:cargoText031" class="outputText">Br.ul. disp.</span></th><th class="headerClass" scope="col" ><span id="subview1:panelForm:addCargoTable1:cargoText03" class="outputText">Tip pakiranja</span></th><th class="headerClass" scope="col" ><span id="subview1:panelForm:addCargoTable1:cargoText04" class="outputText">Tip mjere</span></th><th class="headerClass" scope="col" ><span id="subview1:panelForm:addCargoTable1:cargoText041" class="outputText">Te&#382;ina robe</span></th><th class="headerClass" scope="col" ><span id="subview1:panelForm:addCargoTable1:cargoText042" class="outputText">Volumen</span></th><th class="headerClass" scope="col" ><span id="subview1:panelForm:addCargoTable1:cargoText043" class="outputText">Komada</span></th><th class="headerClass" scope="col"  ><img src="/ExtComConWeb/.ibmjsfres/img/1x1.gif" ></img></th></tr>
</thead><tbody >
<tr class="rowClass1" ><td class="columnClass" ><span  id="subview1:panelForm:addCargoTable1:0:cargoDynText01" class="outputText">72369</span></td>
<td class="columnClass" ><span class="outputText"></span></td>
<td class="columnClass" ><span class="outputText"></span></td>
<td class="columnClass" ><span class="outputText"></span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:0:cargoDynText02" class="outputText">Antracit</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:0:cargoDynText031" class="outputText">00007/06/2015</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:0:cargoDynText03" class="outputText">Nepakirani</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:0:cargoDynText04"  class="outputText">Mjeren po volumenu</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:0:cargoDynText041" class="outputText">121,00</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:0:cargoDynText042"  class="outputText">1.465,000</span></td>
<td class="columnClass" ><span  id="subview1:panelForm:addCargoTable1:0:cargoDynText043"  class="outputText">12</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:0:addCargoGroup1" class="buttonGroup"><a id="subview1:panelForm:addCargoTable1:0:saveCargoLink1" href="#" onclick="if(typeof jsfcljs == 'function') {jsfcljs(document.getElementById('subview1:panelForm'),{'subview1:panelForm:addCargoTable1:0:saveCargoLink1':'subview1:panelForm:addCargoTable1:0:saveCargoLink1','cargoId':'72369'},'');}return false"    class="positive">Dodaj teret</a></span></td>
</tr>
<tr class="rowClass2" ><td class="columnClass" ><span    id="subview1:panelForm:addCargoTable1:1:cargoDynText01"   class="outputText">72454</span></td>
<td class="columnClass" ><span class="outputText"></span></td>
<td class="columnClass" ><span class="outputText"></span></td>
<td class="columnClass" ><span class="outputText"></span></td>
<td class="columnClass" ><span   id="subview1:panelForm:addCargoTable1:1:cargoDynText02"   class="outputText">Banane</span></td>
<td class="columnClass" ><span  id="subview1:panelForm:addCargoTable1:1:cargoDynText031"  class="outputText">00014/06/2015</span></td>
<td class="columnClass" ><span  id="subview1:panelForm:addCargoTable1:1:cargoDynText03"  class="outputText">Palete</span></td>
<td class="columnClass" ><span  id="subview1:panelForm:addCargoTable1:1:cargoDynText04"  class="outputText">Mjeren na komade</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:1:cargoDynText041" class="outputText">1.213,00</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:1:cargoDynText042" class="outputText">121,000</span></td>
 <td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:1:cargoDynText043" class="outputText">12</span></td>
<td class="columnClass" ><span id="subview1:panelForm:addCargoTable1:1:addCargoGroup1" class="buttonGroup"><a id="subview1:panelForm:addCargoTable1:1:saveCargoLink1" href="#" onclick="if(typeof jsfcljs == 'function') {jsfcljs(document.getElementById('subview1:panelForm'), {'subview1:panelForm:addCargoTable1:1:saveCargoLink1':'subview1:panelForm:add    CargoTable1:1:saveCargoLink1','cargoId':'72454'},'');}return false"   class="positive">Dodaj teret</a></span></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</span><span id="subview1:panelForm:addCargoGroup2" class="buttonGroup"> <input type="submit" value="Odustani" id="subview1:panelForm:buttonCancelCargoAdd" name="subview1:panelForm:buttonCancelCargoAdd" class="negative" /></span> </div></div><input type="hidden" name="javax.faces.ViewState"  id="javax.faces.ViewState" value="j_id103:j_id105" /><script  type="text/javascript">
hX_6.addComponent("subview1:panelForm:addCargoDialog", new  hX_6.JSFDialog("no-keybindings:true", "onshow:openDialog()", "onhide:closeDialog()"));

hX_6.addBehavior("subview1:panelForm:buttonCancelCargoAdd", "onclick",  new hX_6.JSFBehaviorGeneric("action:get;hide", "target:subview1:panelForm:helpBox2;subview1:panelForm:addCargoDialog"));
if(hX_6.getBehaviorById("subview1:panelForm:addCargoDialog",  "ajaxsubmit",  "onget"))hX_6.getBehaviorById("subview1:panelForm:addCargoDialog",  "ajaxsubmit", "onget").setAttribute("href:/ExtComConWeb/pages/secure /disposition /dispositionDOTVC.faces?$$ajaxid=subview1:panelForm:addCargoDialog&$$ajaxmode    =axfull");
</script>

The difference is that in case of selecting the cargos for the warehouse, after the one that is empty, I don't get rendered the result table ...
In other case, when first selecting warehouse which has cargos, it works fine ... I can't see the difference which would cause cargo list not rendering ...
Please help ...

[EDIT2]
Also I have noticed when printing pc_DispositionEditCargoDialog.incomingCargosByWarehouseNameAndCargoCompany list:

<h:outputText id="cargoText01" styleClass="outputText" value="# {pc_DispositionEditCargoDialog.incomingCargosByWarehouseNameAndCargoCompany}"    ></h:outputText>

I get:

when warehouse has cargos: [hr.combis.comcon.persistency.hibernate.impl.crg.Cargo@71b78ef4, hr.combis.comcon.persistency.hibernate.impl.crg.Cargo@517ce92d]
[] when warehouse has cargos, but is clicked after warehouse that has no cargos. It's strange, because response has cargo list and I chceked server side function getIncomingCargosByWarehouseNameAndCargoCompany which also returnes not empty list. I can't see why this list is not rendering ...

[EDIT3]
I have noticed that when helpBox2 is removed from addCargoFromWarehouseDialog.jsp, then table of cargos renders normally in the dialog.
This is changed piece of code from addCargoFromWarehouseDialog.jsp (removed helpBox2 item):

<h:panelGroup id="addCargoGroup2" styleClass="buttonGroup">                                         
<hx:commandExButton id="buttonCancelCargoAdd" immediate="true" styleClass="negative" value="#{msg.buttonCancel}"
    action="#{pc_DispositionEditCargoDialog.clearCargos}" type="submit">
    <hx:behavior event="onclick" behaviorAction="hide"
        id="cargoBehavior2"
        targetAction="subview1:panelForm:addCargoDialog">
    </hx:behavior>
</hx:commandExButton>

But now, after I click Cancel button I get the whole page reloaded. Before, when helpBox2 was used, clicking Cancel button would do one more POST with ajax, so the hole page wasn't reloaded again.
Can anybody advise how to accomplish this affect without having to use this helpBox2 trick? Or how to change it in order not to interfering with cargos table rendering?

This is the response of that additional POST with ajax:

<table id="subview1:panelForm:helpBox2"><tr><td></td></tr></table> <input     type="hidden" name="javax.faces.ViewState"  id="javax.faces.ViewState" value="j_id104:j_id120" /><script  type="text/javascript">
if(hX_6.getBehaviorById("subview1:panelForm:helpBox2", "ajaxsubmit",  "onget"))hX_6.getBehaviorById("subview1:panelForm:helpBox2", "ajaxsubmit",  "onget").setAttribute("href:/ExtComConWeb/pages/secure/disposition /dispositionDOTVC.faces?$$ajaxid=subview1:panelForm:helpBox2&$$ajaxmode=axfull");
</script>

Also I have noticed this is acting really strange.
If I do first empty warehouse - works, then full - works.
But full - works, empty - works, full - doesn't work.
I don't get it, what is a trick here?

Please help. Thanks!

Press F12 in browser and share anything which looks abnormal over there. — BalusC, Aug 24 '15 at 09:54
@BlausC I have edited my question (EDIT1 and EDIT2), please take a look. Thanks! — mismas, Aug 24 '15 at 13:21
I expected you'd at least investigate and compare the messages/errors in JS console and the HTTP request/response of Chrome/FF with that of IE. The server side (JSF) doesn't anywhere have browser-specific logic/restrictions. So the cause of the problem can only be in client side. Most commonly being a JS error or a broken cookie. — BalusC, Aug 24 '15 at 13:30
@BlausC Hi, I don't get any errors in JS console (FF, IE). Also response, in FF and IE, is the same. What is a broken cookie and how to detect/deal with it? — mismas, Aug 24 '15 at 14:41
@BlausC I don't get JS errors in FF, also the response (for FF, IE) is the same. I don't know where to look anymore. Please advise me. Thank you. — mismas, Aug 25 '15 at 12:47
@BlausC I've checked headers and it is pretty much the same, nothing abnormal there ... Can you confirm that I am using hx:ajaxRefreshSubmit correctly. Maybe the problem lies there. Or do you see something unusal in the response that I posted? Thanks. — mismas, Aug 26 '15 at 09:30
@BlausC I have edited my question with EDIT3, could you please take a look and give any suggestions you think that could help? Thank you very much. — mismas, Aug 27 '15 at 13:42
@BlausC please take a look. I would be very thankfull for any kind of advise. Please help. Thanks! — mismas, Aug 28 '15 at 09:23
I'm not familiar with IBM faces library so I cannot tell if you're using them right. Also it is closed source instead of open source, so I can neither tell by just downloading it and/or reading its source code. I can only based on the symptom that it works in client X and not in client Y tell that it's an error/bug somewhere in the client side, perhaps even in the IBM faces library itself. The question is in its current form way too much bloated to give a more specific answer. — BalusC, Aug 28 '15 at 09:41

hx:ajaxRefreshSubmit doesn't work in Firefox, Chrome

0 Answers0