1. 程式人生 > >js代碼實現購物車效果

js代碼實現購物車效果

todo ssa lse custom () 分享 sel map 失敗

頁面分上下兩部分,上部分是所有的數據,下部分是購物車。通過在上面選擇需要處理的數據添加進到購物車,實現對購物車數據的統一處理。

需要註意的有兩點:①購物車數據可刪除,且不能重復添加 ②響應時間考慮,購物車單次處理數據最多限制為200條

技術分享圖片

代碼如下:

/**
*添加進購物車方法
*/
function addToDownGrid(){
    var selRows = $("#basicInfoList").datagrid("getChecked");//選擇的用戶面積
    if(selRows==null || selRows.length==0){
        $.messager.alert(
‘提示‘,‘未選中用戶信息!‘,‘info‘); return; } //加入下列表 var curRows = $("#ywCustomerGrid").datagrid("getRows");//已加入購物車的用戶面積 //校驗本次添加後購物車數量是否超出上限200 var maxSize = 200; if(selRows.length + curRows.length > maxSize){ $.messager.alert(‘提示:‘,‘購物車剩余可添加‘+(maxSize - curRows.length)+‘條數據,本次選中‘+selRows.length+‘條,添加失敗!‘,‘info‘);
return; } var map = {}; $.each(curRows, function(index, curRow){ map[curRow.id] = curRow.id; }) //校驗重復,篩除重復選擇的數據 for(var i = 0; i<selRows.length; i++){ var target = map[selRows[i].id]; if(target){ $.messager.alert("提示", "購物車已經存在用戶編碼:" + selRows[i].code + "的信息!!","info");
return ; } } $.each(selRows, function(index, selRow){ $("#ywCustomerGrid").datagrid("appendRow", selRow); }) $.messager.alert(‘提示:‘,‘添加成功!‘,‘info‘); //清空上列表選擇 $("#basicInfoList").datagrid("uncheckAll"); } /** *移出購物車方法 */ function removeFromDownGrid(){ var customerRow = $("#ywCustomerGrid").datagrid("getSelected"); if(!customerRow){ $.messager.alert(‘提示:‘,‘未選中用戶!‘,‘info‘); return false; } var selRows = $("#ywCustomerGrid").datagrid("getChecked"); if(selRows!=null && selRows.length>0){ for(var i=0;i<selRows.length;i++){ var rowIndex = $("#ywCustomerGrid").datagrid("getRowIndex",selRows[i]); $("#ywCustomerGrid").datagrid("deleteRow",rowIndex); } } //清空購物車選擇 $("#ywCustomerGrid").datagrid("uncheckAll"); }

js代碼實現購物車效果