Javashop 商品选择器jquery插件使用指南

一、概述

Javashop 商品选择器jquery插件是一款基于jquery插件的商品选择器,目前1.0的版本基于easyui,适用于javashop 5.2及以上版本。

可用于在后台快速生成一个或多个商品选择器,有如下特点:

  •  基于jquery插件的风格,只需引入一个插件脚本,其它不用关心,生成方便灵活
  •  同个页面可生成多个选择器,互相不干扰
  • 提供丰富配置参数和接口,可插入多样的业务中

效果预览

二、使用说明

1.基本使用指南

1.引入选器插件:

<script type="text/javascript" src="/shop/admin/js/jquery.goodsSelector.js"> </script>

2.声明需要生成选器的元素(同时也指定了要在哪生成)

<div class="floor_goods"></div>

3.调用插件生成选择器

<script type="text/javascript">

$(function(){

$(".floor_goods").goodsSelector();

});

</script>

如上代码但在样式为floor_goods的div中生成了商品选择器。

上述情况一般用于添加页面,也就是还没有已经选商品。

可以指定selected_data_url参数,即:当前已选中的商品grid的json地址。

<script type="text/javascript">

$(function(){

var options ={

selected_data_url:ctx+'/shop/admin/floorGoods!listGoodsJson.do?floorid=1'

}

$(".floor_goods").goodsSelector(options);

});

</script>

也就是你的业务中已经选中商品的json 地址,其格式为easyui的grid json格式,举例如下:

{“total”:2,”rows”:[
{"goods_id":285,"sn":"201511243123","name":"xxxx","price":300,"store":444},{"goods_id":284,"sn":"2015112400656","name":"xxx","price":270,"store":666}]}
一般用于修改页面

2.参数说明

  可选参数

  •  selected_data_url:

指定已经选中的grid的商品数据json URL

  •   selector_data_url

选器商品Grid的商品数据 json url,默认为:/shop/admin/goodsSelect!listGoodsById.do

  •  select_btn_text: 选择按钮的文字
  •  un_select_btn_text:取消选择按钮的文字
  •  selected_text:已选中的文字
  • goodsid_name:向后台post的商品id名字,默认为:goods_id_array

特别请注意goodsid_name的参数,此参数是向后台提交的已经选中的商品id的数组的name,是一组hidden的name,在默认时此hidden的name为goods_id_array,此时post的参数效果为:

我们更改goodsid_name参数,例如:

var options ={

selected_data_url:ctx+'/shop/admin/floorGoods!listGoodsJson.do?floorid=1'
,goodsid_name:'myname'
}

$(".floor_goods").goodsSelector(options);
此时post参数的效果为:

Javashop 商品选择器jquery插件使用指南》上有 3 条评论

发表评论