PHP.39-TP框架商城應用實例-後臺16-商品屬性2-AJAX添加、刪除
阿新 • • 發佈:2017-06-24
false .ajax ucc 下標 peid query 添加 split nbsp
添加商品屬性
思路:根據【後臺15】類型表{id,type_name}與屬性表{id,attr_name,attr_type,attr_option_values,type_id}
1、建表商品屬性表p39_goods_attr{id,attr_value,attr_id,goods_id}
/********商品屬性表【多對多:一個屬性可以有多個值,一個商品可以有多個屬性,一個屬性可以對應多個商品】*******/ drop if exists p39_goods_attr; create table p39_goods_attr ( id mediumint unsigned notnull auto_increment comment ‘Id‘, attr_value varchar(150) not null default ‘‘ comment ‘屬性值‘, attr_id mediumint unsigned not null comment ‘屬性Id‘, //屬性id對應屬性表中的屬性id->值 goods_id mediumint unsigned not null comment ‘商品Id‘, primary key (id), key goods_id(goods_id), key attr_id(attr_id) )engine=InnoDB default charset=utf8 comment ‘商品屬性‘;
註:在商品表p39_goods中添加字段保存類型id
ALTER TABLE p39_goods ADD column type_id mediumint unsigned not null default ‘0‘ comment ‘類型id‘;
2、在添加商品/Goods/add.html的表單中使用封裝好的函數buildSelect()制作一個類型的下拉框,並放一個UL標簽來存放屬性
3、在商品控制器中添加ajaxGetAttr處理這個AJAX請求,輸出json
4、AJAX與JS綁定事件addNewAttr
// 選擇類型獲取屬性的AJAX $("select[name=type_id]").change(function(){ // 獲取當前選中的類型的id var typeId = $(this).val(); // 如果選擇了一個類型就執行AJAX取屬性 if(typeId > 0) { // 根據類型ID執行AJAX取出這個類型下的屬性,並獲取返回的JSON數據 $.ajax({ type : "GET", url : "<?php echo U(‘ajaxGetAttr‘, ‘‘, FALSE); ?>/type_id/"+typeId, dataType : "json", success : function(data) { /** 把服務器返回的屬性循環拼成一個LI字符串,並顯示在頁面中 **/ var li = ""; // 循環每個屬性 $(data).each(function(k,v){ li += ‘<li>‘; // 如果這個屬性類型是可選的就有一個+ if(v.attr_type == ‘可選‘) /************ 綁定點擊事件增加[+] =》addNewAttr()******/ li += ‘<a onclick="addNewAttr(this);" href="#">[+]</a>‘; // 屬性名稱 li += v.attr_name + ‘ : ‘; // 如果屬性有可選值就做下拉框,否則做文本框 if(v.attr_option_values == "") li += ‘<input type="text" name="attr_value[‘+v.id+‘][]" />‘; else /********* v.id[屬性ID(attr_id)做下標],提交表單處理*************/ { li += ‘<select name="attr_value[‘+v.id+‘][]"><option value="">請選擇...</option>‘; // 把可選值根據,轉化成數組 var _attr = v.attr_option_values.split(‘,‘); // 循環每個值制作option for(var i=0; i<_attr.length; i++) { li += ‘<option value="‘+_attr[i]+‘">‘; li += _attr[i]; li += ‘</option>‘; } li += ‘</select>‘; } li += ‘</li>‘ }); // 把拼好的LI放到 頁面中 $("#attr_list").html(li); } }); } else $("#attr_list").html(""); // 如果選的是請 選擇就直接清空 }); // 點擊屬性的+號2 function addNewAttr(a) { // $(a) --> 把a轉換成jquery中的對象,然後才能調用jquery中的方法 // 先獲取所在的li var li = $(a).parent(); if($(a).text() == ‘[+]‘) { var newLi = li.clone(); // +變- newLi.find("a").text(‘[-]‘); // 新的放在li後面 li.after(newLi); } else li.remove(); }
5、循環處理每個屬性值插入到商品屬性表=>修改商品模型GoogsModel.class.php 在添加後_after_insert()的鉤子方法中添加代碼
/***************處理插入的商品屬性p39_goods_attr***/ $attrValue = I(‘post.attr_value‘); $gaModel = M(‘goods_attr‘); //var_dump($attrValue);die; foreach ($attrValue as $K => $v) { //把屬性值數組【二維】去重 $v = array_unique($v); $k = $K; //var_dump($v);die; foreach ($v as $k1 => $v1) { $gaModel->add(array( ‘goods_id‘ => $data[‘id‘], ‘attr_id‘ => $k, ‘attr_value‘ => $v1, )); } }
註:在添加商品時,把商品類型更新到商品表中的type_id字段上,修改商品模型設置允許接收type_id字段
商品屬性的刪除
思路:當刪除一件商品時,這件商品所有的屬性也一起刪除
PHP.39-TP框架商城應用實例-後臺16-商品屬性2-AJAX添加、刪除