javascript - how to call a j-query modal dialog in jsf dataTable -
javascript - how to call a j-query modal dialog in jsf dataTable -
i have jquery javascript file calls modal way, in js script
$("#dialog_f").dialog({autoopen: false, modal: true, width: 400}); $("#dialog_p").click(function() { $("#dialog_f").dialog('open'); console.log('modal called'); }); and in jsf xhtml page
<button class="btn" type="button" id="dialog_p">update fault</button> <div class="dialog" id="dialog_f" style="display: none;" title="update fault"> <div class="block"> </div> </div> this works fine in normal page in jsf datatable noticed calls lastly object in list managed bean , doesnt popup modal. noticed printing console.log in js file. there possibility id been rendered in list , controller doesnt know button supposed phone call modal ?
<ui:define name="content"> <h:datatable var="fau" value="#{faultcontroller.allfaultst}" > <h:column > <f:facet name="header" > fault id </f:facet> <h:outputtext value="#{fau.faultid}" /> </h:column> <h:column > <f:facet name="header" > action </f:facet> <button class="btn" type="button" id="dialog_f">update fault</button> <div class="dialog" id="dialog_p" style="display: none;" title="update fault"> <div class="block"> </div> </div> </h:column> </h:datatable> </ui:define> n.b alternatively, using class pops modals bad thought ;)
$("#dialog_p").dialog({autoopen: false, modal: true, width: 400}); function opendialog() { $("#dialog_p").dialog('open'); console.log('modal called'); }; .... <ui:define name="content"> <h:datatable var="fau" value="#{faultcontroller.allfaultst}" > <h:column > <f:facet name="header" > fault id </f:facet> <h:outputtext value="#{fau.faultid}" /> </h:column> <h:column> <f:facet name="header" > action </f:facet> <button class="btn" type="button" onclick="opendialog();">update fault</button> </h:column> </h:datatable> <div class="dialog" id="dialog_p" style="display: none;" title="update fault"> <div class="block"> </div> </div> </ui:define>
why need dialog each row in table? suppose want show row specific info in dialog. if can accomplish through backing bean.
javascript jquery twitter-bootstrap jsf jsf-2
Comments
Post a Comment