- 在添加商品的表单中制作一个类型的下拉框
<!-- 商品属性 -->
<table style="display:none;" width="90%" class="tab_table" align="center">
<tr><td>
商品类型: <?php buildSelect('Type','type_id','id','type_name'); ?>
</td></tr>
</table>
-
// 选择类型获取属性的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 == '可选')
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
{
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 在类型下拉框下面放一个UL标签用来存属性
<!-- 商品属性 -->
<table style="display:none;" width="90%" class="tab_table" align="center">
<tr><td>
商品类型: <?php buildSelect('Type','type_id','id','type_name'); ?>
</td></tr>
<tr>
<td><ul id="attr_list"></ul></td>
</tr>
- 在商品控制器中添加ajaxGetAttr处理这个AJAX请求
class GoodsController extends Controller
{
// 处理获取属性的AJAX请求
public function ajaxGetAttr()
{
$typeId = I('get.type_id');
$attrModel = D('Attribute');
$attrData = $attrModel->where(array(
'type_id' => array('eq', $typeId),
))->select();
echo json_encode($attrData);
}
- 为+号添加JS代码
a) 为a标签添加点击事件
// 如果这个属性类型是可选的就有一个+
if(v.attr_type == '可选')
li += '<a onclick="addNewAttr(this);" href="#">[+]</a>';
// 属性名称
li += v.attr_name + ' : ';
添加这个函数:
// 点击属性的+号
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();
}
- 提交表单之后把商品属性保存到 :
修改商品属性表的的名字
if(v.attr_option_values == "")
li += '<input type="text" name="attr_value['+v.id+'][]" />';
else
{
li += '<select name="attr_value['+v.id+'][]"><option value="">请选择...</option>';
5.2 在商品添加之后,得到 商品ID,然后接收这些属性并插入到 商品属性表
把打印表单中的数据
结果只提交上来三个:
原因是因为:+号克隆时名字完全相同所以只提交上来一个
可以这样解决:把名称改成二维数组:
// 如果属性有可选值就做下拉框,否则做文本框
if(v.attr_option_values == "")
li += '<input type="text" name="attr_value['+v.id+'][]" />';
else
{
li += '<select name="attr_value['+v.id+'][]"><option value="">请选择...</option>';
现在写代码循环处理每个属性值插入到商品属性表即可
修改商品模型 在添加后的钩子方法中添加代码:
protected function _after_insert($data, $option)
{
/************ 处理商品属性的代码 *****************/
$attrValue=I('post.attr_value');
$gaModel=D('goods_attr');
foreach($attrValue as $k =>$v)
{
//把属性值的数组去重
$v=array_unique($v);
foreach($v as $k1 =>$v1)
{
$gaModel->add(array(
'goods_id'=>$data['id'],
'attr_id'=>$k,
'attr_value'=>$v1,
));
}
}
在添加商品时,把商品类型更新到 商品表中的type_id字段上
修改商品模型 ,设置允许接收type_id字段:
class GoodsModel extends Model
{
// 添加时调用create方法允许接收的字段
protected $insertFields = 'goods_name,market_price,shop_price,is_on_sale,goods_desc,brand_id,cat_id,type_id';
// 修改时调用create方法允许接收的字段
protected $updateFields = 'id,goods_name,market_price,shop_price,is_on_sale,goods_desc,brand_id,cat_id,type_id';
//定义验证规则
商品属性的删除:当删除一件商品时,这件商品所有的属性也一起删除
修改商品模型在删除之前添加代码:
protected function _before_delete($option)
{
$id = $option['where']['id']; // 要删除的商品的ID
/************** 删除商品属性 ********************/
$gaModel=D('goods_attr');
$gaModel->where(array(
'goods_id'=>array('eq',$id),
))->delete();
商品属性的修改
- 把上午做的添加的下拉框和AJAX先复制到 修改的表单中
1.1 先复制类型的下拉框,并设置当前选中的状态
<!-- 商品属性 -->
<table style="display:none;" width="90%" class="tab_table" align="center">
<tr><td>
商品类型:<?php buildSelect('Type', 'type_id', 'id', 'type_name',$data['type_id']); ?>
</td></tr>
<tr>
<td><ul id="attr_list"></ul></td>
</tr>
</table>
1.2 把最后的JS代码复制过来
两代码JS:AJAX和+号的函数
复制过来之后
效果:
如果之前设置过属性值,应该在显示表单时直接显示出来【直接用PHP显示出原属性值】