I'm currently developing a webpage that when user input the data needed in Advance Filtering and click on the button'Search Result',the table will show the data needed,but the problem is i get the error of DataTables warning (table id = 'DataTables_Table_0'):
when i try to load the page.
This is my javascript code:
(function() { /* --- caching dom based on structure--- */ var $document = $(document.body); // -* var $msp_filter = $document.find("#msp_filter"); // -** var $msp_open_btn = $msp_filter.find("#msp_open_btn"); var $msp_content = $msp_filter.find("#msp_filter_content"); // -*** var $f_month = $msp_content.find("#f_month"); var $f_month_2 = $f_month.next(); var $f_date = $msp_content.find("#f_date"); var $f_time = $msp_content.find("#f_time"); var $f_product = $msp_content.find("#f_product"); var $f_comp = $msp_content.find("#f_comp"); var $f_order = $msp_content.find("#f_order"); var $f_select_co = $f_month.add([$f_product[0], $f_comp[0], $f_order[0], $f_month_2[0]]); // -*** var $f_t_search = $msp_content.find("#f_text_search"); var $f_f_search = $msp_content.find("#f_form_search"); var $f_t_refresh = $f_f_search.next(); var $f_f_reset = $f_t_refresh.next(); // -* var $msp_table = $msp_filter.next(); // -** var $huntertable = $msp_table.find(".hunter-table"); var $wrapper__btn = $msp_table.find("header").find(".t_r").find("a"); // -*** var $SummaryTable = $huntertable.find(".SummaryTable"); // -* var $msp__daily_wrapper = $document.find("#msp__daily_wrapper"); // -* var $msp__form_wrapper = $msp__daily_wrapper.next(); // -* var $msp__rep_wrapper = $msp__form_wrapper.next(); var $rTable = $msp__rep_wrapper.find("#prl-table"); // -* var $msContainer = $msp__form_wrapper.length ? ($msp__rep_wrapper.next()) : ($document.find("#msContainer")) ; var sectionwrapper = { msp__daily_wrapper : $msp__daily_wrapper, msp__form_wrapper : $msp__form_wrapper, msContainer : $msContainer, msp__rep_wrapper : $msp__rep_wrapper }; var $window = $(window); var offset = $msp_filter.offset(); var ggTable; // init jtable with document.ready // duno why $(function() { var oTable, sumTable, tableWidth = $huntertable.width(); // Summary Table from summary page $SummaryTable.length > 0 && $SummaryTable.each(function() { if (!$(this).hasClass("dataTable-custom")) { var e = { sPaginationType : "full_numbers", sDom : '<"voon"fl>rt<"joon"ip>', oLanguage : { sSearch : "<span class='vccc'>Date Filter :</span><select id='wipFilter'></select><span>Quick Search :</span> ", sInfo : "Showing <span>_START_</span> to <span>_END_</span> of <span>_TOTAL_</span> entries", sLengthMenu : "_MENU_ <span>entries per page</span>" }, bSort : false, iDisplayLength : 25, bDeferRender : true, bProcessing : true, bServerSide : true, fnRowCallback : function(nRow, aData, iDisplayIndex, iDisplayIndexFull) { return nRow; }, fnServerParams : function(data) { data.push( { name : 'month' , value : $f_month.val() }, { name : 'month2' , value : $f_month_2.val() }, { name : 'date' , value : $f_date.val() || 'no' }, { name : 'time' , value : $f_time.val() || 'no' }, { name : 'product', value : $f_product.val() }, //{ name : 'comp' , value : $f_comp.val() }, { name : 'search' , value : $f_t_search.val() || 'no' } ); }, fnDrawCallback : function() { } }; if ($(this).hasClass("dataTable-display")) { e.iDisplayLength = 10; e.bDeferRender = !0; } ggTable = $(this).dataTable(e); $(".dataTables_filter input").attr("placeholder", "Search here..."); $(".dataTables_length select").wrap("<div class='input-mini'></div>").chosen({ disable_search_threshold : 9999999 }); } }); // end summary table // caching DOM and bind event $huntertable.each(function(){ var $this = $(this), $container = $this.find("div.wip-container"), $dummyMain = $this.find("div.hentai-main"), $dummyScroll = $dummyMain.find("div.hentai-scroll"), $dummy = $dummyScroll.find("div.dummy-scroll"), $voon = $container.find("div.wip-slider").find("div.voon"), $wipFilter = $voon.find("select#wipFilter"), $joon = $container.find("div.wip-slider div.joon"), $table = $container.find("div.wip-slider table"), $span = $table.find("span.tabletitle"), $datestr = $container.find("input#wipDate"), $dateoption = $datestr.val(), $todaydate = $container.find("input#todayDate"), poch = $todaydate.val(); // asyn scroll bar with the original one $dummyScroll.css("width",tableWidth + "px"); $dummy.css("width",( $table.width() + 10) +"px"); // scroll event $container.on("scroll",function(){ var pixel = $(this).scrollLeft(); $voon.css("margin-left", pixel + "px"); $joon.css("margin-left", pixel + "px"); // update dummy scroll bar $dummyScroll.scrollLeft(pixel); }); // when scrolling dummy, update the original one $dummyScroll.on("scroll",function(){ var pixel = $(this).scrollLeft(); $container.scrollLeft(pixel); }); // when window Resize, update the dummy scroll width $(window).resize(function(){ var width = $(".hunter-table").width(); $dummyScroll.css("width",width + "px"); }); $(window).on("scroll",function(){ var container = $container.offset().top; if($(this).scrollTop() > container ) { $dummyMain.addClass("revFixed"); } else { $dummyMain.removeClass("revFixed"); } }); // filter by date $wipFilter.append($dateoption) .change(function(){ var val = $(this).val(); if(val === 'all') { ggTable.fnFilter("",7); } else { ggTable.fnFilter(val,7); } }); // auto filter after page landing // this statement must go before the previous one $wipFilter.children("option[value^='" + poch +"']").prop("selected","selected").change(); }); // end cache dom // redraw otable function ofs() { window.ggTable.fnDraw(); } $f_select_co.on("change", ofs); $f_t_refresh.on("click", ofs); $f_f_search.on("click", ofs); $f_f_reset.on("click", resetform); $wrapper__btn.on("click", open_wrapper); function resetform() { $f_t_search.val(""); $f_month.val("All"); $f_month_2.val("No Filter"); $f_date.val(""); $f_time.val(""); $f_product.val(""); // $f_comp.val(""); } }); function open_wrapper(e) { e.preventDefault(); var href = this.getAttribute("data-href").split("/"); var $sectionwrapper = sectionwrapper[href[0]]; var toggle; $sectionwrapper.removeClass("msp-none"); } $msp_open_btn.on("click", function() { var isclose = $msp_content.hasClass("msp-none"); $msp_content.toggleClass("msp-none", (!isclose)); }); })();
this is the image of my template
https://drive.google.com/file/d/0B46VQHVMeBTNbFhKMkhlUUE5ZkE/view?usp=sharing
What exactly is causing this error??
Can anybody help me?? :unsure: :unsure: :unsure: