在<f:ajax> </f:ajax>中呈现数据表后,Jquery数据表功能不适用

时间:2012-03-19 09:38:57

标签: javascript jquery jsf

这里是jquery脚本

 <script type="text/javascript" charset="utf-8">
                var oTable;
                               $(document).ready(function() {
                                    oTable = $('#example').dataTable({   
                                    "bJQueryUI": true,
                                    "sPaginationType": "full_numbers",
                                    "bRetrieve": true
                                       } );
                               } );

                               function datatable()
                               {
                                  oTable.fnDestroy();                                                                            
                                   oTable = $('#example').dataTable({
                                    "bJQueryUI": true,
                                    "sPaginationType": "full_numbers",
                                   "bRetrieve": true
                                     } );
                               }
            </script>

这里是模型panal脚本

 $( "#dialog-form" ).dialog({
                    autoOpen: false,
                    show: "blind",
                    hide: "explode",
                    width: "400px",
                    modal: true ,
                    buttons: {
                        "register-close" : function() {
                    $("#register").click();
                  datatable();
                    $( this ).dialog( "close" );

                    }

        }
            });

这是按钮点击代码

<h:commandButton value="Register" action="#{employeeListBean.register}" id="register" style="display: none" onclick="alert('asdsa')" >
                                <f:ajax execute="userId password empName Address gender mobNo loginname"  render=":example"/>
                            </h:commandButton>

当我点击那个按钮编辑成功完成并且数据表现在也渲染时,问题是渲染数据表后,表格上没有应用jquery数据表功能。

1 个答案:

答案 0 :(得分:1)

你需要在ajax事件渲染上重新应用table(),添加这段代码......

$(window).load(function() {
    jsf.ajax.addOnEvent(function (data) {
        if (data.status === "success") {
            oTable = $('#example').dataTable({   
                     "bJQueryUI": true,
                      "sPaginationType": "full_numbers",
                       "bRetrieve": true
             } );
        }
    }
});