PHP實現多條採購單據界面

前言：寫這個博文前幾天，還一直在糾結中，可是作完了感受自信又回來了，做爲一名後端程序員，前端的簡單的佈局是在所不免的，因此有時候也是要折騰一下前端。

 

一  功能簡述

　　這個功能主要是用於相關部門打請購申請的，添加多條明細用的

二 實現的效果圖

 

三 技術難點

　　

因爲我用的是Eaysui的前端佈局，而且封裝了一個common.js調用easyui的效果來實現;
剛開始是用表格來顯示的，可是因爲數據比較多，在一行顯示顯得不夠友好，因此考慮用塊來解決，
這裏問題來了，因爲添加節點會在頁面已經渲染完成了，用戶才主動加進去的，
因此input框是沒有任何的效果的，所以這裏須要解決的是添加了要還原之前的效果，
解決方案1：$.parser.parse($('#tt').parent()); 這個主要是主動調用Easyui再次渲染頁面，很不幸，這個只對用了Easyui中class的方法纔會有效果
解決方案2：當用戶添加時候再次調用自動加載函數來解決樣式和url請求的問題

 

四 代碼

//這裏只貼一部分代碼，經過id動態用戶添加時候加一個index標誌每次添加id都會動態變化，再次去調用初始化方法，注意初始化也須要加入index標誌動態變化

function pur_info() {    //把id的值設置爲動態值    var money = "#money" + index_run;    var goods_name = "#goods_name" + index_run;    var supplier_name = "#supplier_name" + index_run;    var buy_num = "#buy_num" + index_run;    var invoice_flag = "#invoice_flag" + index_run;    var comment = "#comment" + index_run;    var pay_status = "#pay_status" + index_run;    var id_goods_len = "#id_goods_len" + index_run;    var goods_num = "#goods_num" + index_run;    var goods_spe = "#goods_spe" + index_run;    var cust_name = "#cust_name" + index_run;    var using = "#using" + index_run;    var supplier_info = "#supplier_info" + index_run;    //物品名稱    init_easyui_textbox(goods_name, {        required: true,        width: 100,    });    //供應商名    init_easyui_textbox(supplier_name, {        required: true,        width: 100    });    //總價    init_easyui_numberbox(money, {        required: true,        editable: false,        min: 0,        width: 100    });    //規格    init_easyui_textbox(goods_spe, {        width: 100    });    //客戶名    init_easyui_textbox(cust_name, {        width: 100    });    //用途    init_easyui_textbox(using, {        width: 100    });    //供應商信息    init_easyui_textbox(supplier_info, {        width: 100    });    //購買單價    init_easyui_numberbox(buy_num, {        required: true,        min: 0,        width: 100    }).numberbox({        onChange: function (newValue, oldValue) {            var num = $(goods_num).numberbox('getValue');//獲取到數量            var sum_m = parseFloat(num) * newValue;//總價            $(money).numberbox('setValue', sum_m);        }    });    //購買數量    init_easyui_numberbox(goods_num, {        required: true,        min: 0,        width: 100    });    //備註    init_easyui_textbox(comment, {        width: 200,        height: 80,        multiline: true,        multiple: true,        validType: ''    });    //是否開票    init_easyui_combox(invoice_flag, {        required: true,        width: 100,        data: [            {label: "否", value: "0"},            {label: "是", value: "1"},        ],        panelHeight: 60    });    //結算方式    init_easyui_combox(pay_status, {        required: true,        width: 100,        data: [            {label: "現款結算", value: "0"},            {label: "轉帳結算", value: "1"},        ],        panelHeight: 60    });    //採購單位    init_easyui_combox(id_goods_len, {        required: true,        url: url_measdoc,        width: 100    });    index_run++;}