[原创]ASP.NET MVC使用EasyUI的datagrid多选提交保存教程

需要实现EasyUI的datagrid组件加入选择checkbox列,并提交后台批量添加的功能,页面代码如下:

<script language="javascript" type="text/javascript">
    $(function() {
        //searchbox
        $('#selectgoods-keywords').searchbox({
            searcher: function(val, name) {
                searchInfo(val);
            }
        });
        //datagrid
        $('#selectgoods-grid').datagrid({
            url: '/Goods/List',
            pageNumber: 1,
            pageSize: 20,
            pageList: [20, 40, 60, 80, 100]
        });
        //form



    });
    
    function searchInfo(val){
        //            var keytype=$('#keyType').combobox('getValue');
            var keytype = 'Goods_Name';
            var keywords = val;
            $('#selectgoods-grid').datagrid('reload', { keytype: keytype, keywords: keywords });
    }

    function saveSelectGoods() {
        var ids = [];
        var rows = $('#selectgoods-grid').datagrid('getSelections');
        for (var i = 0; i < rows.length; i++) {
            ids.push(rows&#91;i&#93;.Identifier);
        }
        var selectsupplier = '<%=ViewData&#91;"supplier"&#93; %>';
        $.post('/SupplierGoods/SaveSelect', { supplier: selectsupplier, checks: ids.join(',') }, function(data) {
            if (data) {
                $('#goodslist-grid').datagrid('reload');
                $('#goodsInfo-window').window('close');
            } else {
                alert('保存失败!');
            }

        }, 'json');
    
    }
        
</script>
    <div style="width:100%; height:100%">
			                 <table id="selectgoods-grid" class="easyui-datagrid" fit="true" toolbar="#tlb_selectgoods_search" pagination="true" 
			rownumbers="true" fitColumns="true"  idField="Identifier">
		                <thead>
                <tr>
                <th field="ck" checkbox="true"></th>  	    			   
            <th field="Identifier" hidden="true" width="0" editor="text">Id</th>
            <th field="Goods_Name" width="100" editor="{type:'validatebox',options:{required:true}}">商品名称</th>
            <th field="Chemistry" width="100" editor="{type:'validatebox',options:{required:true}}">化学指标</th>
            <th field="Physical" width="100" editor="{type:'validatebox',options:{required:true}}">物理指标</th>
            <th field="Partner_Name" width="50" editor="{type:'validatebox',options:{required:true}}">合作状态</th>
              </tr>			
		                    </thead>
	                    </table>
              
	<div id="tlb_selectgoods_search">
商品名称:<input name="keywords" id="selectgoods-keywords" class="easyui-searchbox" /><a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:saveSelectGoods()">保存</a>

	</div>    
    </div>

ASP.NET MVC的Controller代码如下:

        /// <summary>
        /// 多选商品添加
        /// </summary>
        /// <param name="supplier">供货商ID</param>
        /// <returns></returns>
        public ActionResult SelectGoods(string supplier)
        {
            ViewData["supplier"] = supplier;

            return View();            
        }
        /// <summary>
        /// 保存批量添加的产品信息
        /// </summary>
        /// <param name="checks">选中的商品ID</param>
        /// <param name="supplier">供货商名称</param>
        /// <returns></returns>
        public JsonResult SaveSelect(string checks, string supplier)
        {
            JsonResult result = new JsonResult();
            result.Data = false;

            try
            {

                if (String.IsNullOrEmpty(supplier))
                    return result;

                SupplierGoods goods = new SupplierGoods();
                goods.Identifier = 0;
                //拼装xml
                String ids=Communion.StringHelper.BuildXmlID(checks);
                goods.Goods_ID = -1;//标示批量插入
                goods.Note = ids;
                goods.Month_Output = Convert.ToDouble(String.IsNullOrEmpty(this.ReadFromRequest("Month_Output")) ? "0" : this.ReadFromRequest("Month_Output"));
                goods.Supplier_ID = Convert.ToInt32(supplier);
                goods.Create_Date = DateTime.Now;
                goods.Customers = this.ReadFromRequest("Customers");
                goods.Equipment = this.ReadFromRequest("Equipment");
                goods.Detail_Params = this.ReadFromRequest("Detail_Params");
                goods.IsDefault = Convert.ToInt32(String.IsNullOrEmpty(this.ReadFromRequest("IsDefault")) ? "0" : this.ReadFromRequest("IsDefault"));
                Business business = new BusinessLogic();
                int id = business.Save<SupplierGoods>(goods);
                if (goods.Identifier == 0)
                {
                    goods.Identifier = id;
                }
                result.Data = true;
                return result;

            }
            catch (Exception e)
            {
                return result;
            }            
        }

存储过程利用xml变量对传入的xml类型的ID集合进行批量添加保存到数据库中,存储过程代码如下:

ALTER PROCEDURE [dbo].[View_SupplierGoodsCreate]
	@Identifier int,
	@Supplier_ID int,
	@Goods_ID int,
	@isDefault int,
	@Create_Date datetime,
	@Month_Output float(8),
	@Goods_Name nvarchar(400)=NULL,
	@Physical nvarchar(400)=NULL,
	@Chemistry nvarchar(400)=NULL,
	@Customers nvarchar(400)=NULL,
	@Equipment nvarchar(400)=NULL,
	@Note nvarchar(MAX)=NULL,
	@Detail_Params nvarchar(400)=NULL
AS
IF @Goods_ID=-1
BEGIN
		--批量插入商品
		DECLARE @xml xml
		SET @xml=@Note
		INSERT INTO Supplier_Goods(Supplier_ID,Goods_ID,Create_Date,Month_Output,Customers,Equipment,Note,isdefault,Detail_Params)
		SELECT @Supplier_ID,identifier,@Create_Date,0,null,null,null,0,null 
		FROM Base_Goods		
		WHERE
			 Identifier in (Select 
			T.ID.value('.', 'int') As ID
		From
			@xml.nodes('/XML/ID') as T(ID)) and Identifier not in (select goods_id from Supplier_Goods where Supplier_ID=@Supplier_ID)
		SET @Identifier=@Goods_ID	
END
赞(0) 打赏
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏