freemarker+datatable寫前端的使用筆記

界面的提示信息：其實在ajax的success內提示的；

一些公用的頁面部分及其頁面分塊寫在其他文件內，之後引用就可以了；
在卡式佈局之內，也就是與表單的div是同一級別的地方是模態框：
    表單查詢
        resetClick()
        queryClick()
    表單的主內容:表單的標題

    模態框插入IModal，
        頭部clearInsModal(),點擊消失模態框及其清楚insert的數據，
        體部insertClick()
    模態框uModel
        修改一行商品(用戶)信息updateClick()
    標籤語法內容:
        1:<#assign modelID=”topModal”>
        2:<#assign moduleTitle=”是否置頂該商品”>
        3:<#assign moduleClick=”函數名”>
        4:<#include “/路徑/dialog.ftl”/>文件 提示文件，
        該文件內竟然還是模態框，使用${取出變量值},${moduleClick}模態點擊函數名字
        eg:
        <#assign modalId = "topModal">
        <#assign moduleTitle = "是否置頂該商品？">
        <#assign moduleClick = "statusClick()">
        <#include "/freemarker/base/dialog.ftl"/>

        </div>之後
            Js代碼
        </body>之前

        Jquery.min.js ，datatableJS，calendar.mincss沒發現日曆js
        let moduleData=new Map();//map數據結構存鍵值對
        $.ready(function(){
        queryClick();//查詢後臺表單
        });
        $(document).ready(function(){
        ajax查詢所有的產品列表，
        ajaxc查詢渠道信息
        })

    queryClick()函數
    datable的數據解析 full參數是一條記錄的所有數據，
    一行數據的樣式:data-toggle=”modal” data-whatever=”@getbootstrap” data-target=”#shelfModal、#obtainModal、topModal” 還有各種的提示信息，原來都是在提示dialog.ftl內引用的；data-target=”#uModal”是修改的模態框，
    一行數據的函數有：statusModal(cmdID,1)是否上架,statusModal(cmdID,2)是否置頂

    表單查詢
        resetClick()
        queyClick()
            $(‘#datatab’).Datatable().destroy();消失
        再查再顯示，
            statusModal(cmd,2) 已/未置頂，放在map中的數據
            statusModal(cmd,1) 已/未上架，模態框插入IModal，
            uModal(cmdID)修改，其實是先向後臺的一個查詢，再次將數據填充到模態框內，updateClick():url是拼接出來的,
            statusModal(cmdId,status,type):沒有向後臺發送請求，重新設置整型值，然後該模態框再次執行函數statusClick()，再次取出map中的值，向後臺的不同url發請求，傳參數等等；
    頭部:”X”符號，clearInsModal()
    體部:確認上架:
        insertClick():url是拼接出來的，insert之後再次:
            Document.getElementById(“iModal”).click()相當於再次執行點擊事件，該事件執行清除數據函數，
            $(‘#datatab’).DataTable().draw(false);相當於模態框再次消失

        resetClick():comTypeId將重新賦值
            $(‘#input idName option:frist’).prop(‘selected’,’selected’);也就是被選中
    dialog.ftl
        statusClick() 修改置頂或者是狀態(上架)，向後臺發送請求
    一行數據狀態查詢：

    "columnDefs": [
        {
            "targets": [6],
            "render": function (data, type, full) {
                return data === 1 ? "普通更新" : "強制更新";
            }
        },
        {
            "targets": [9],
            "render": function (data, type, full) {
                return data === 1 ? "未發佈" : "已發佈";
            }
        }
        ],

    原有值改變其顯示，有種後者的味道，

方法使用：

 $('#datatab').DataTable().draw(false);//消失重查
$('#datatab').DataTable().destroy();

document.getElementById("iModalX").click();
數據清空好像模態框消失