jq实现把弹框填写的内容传给表格单元格中

目录

前言:

实现效果:

解决思路:

代码:

html部分:

jq部分:

---

前言:

为了加载速度更快,不浪费资源,所以领导要求我每次添加内容以后,不更新页面去展示我添加的内容,这个时候,我参考了之前写好的其他页面.发现领导的解决思路是把填写的内容给需要更新显示的表格中.

实现效果:

 

可以看到弹框中有报销数量,我填写以后,需要在表格中展现我填写的内容.

解决思路:

难点:一个产品可能会在多个项目中出现,同时如何区别报销数量是哪个产品呢?

解决思路:每条产品它都是有对应的项目代码以及商品编号的.所以如果只熬到该商品是在哪个项目下的,同时知道他的商品编号就好办了.

所以我们把每条产品对应的项目代码已经商品编号给表格中报销数量的class名中.

这样我们就知道怎么一一对应了.接下来看代码吧!

代码:

html部分:

<td align="center"  class="applyColor ' + listData[i].itemcode + ' ' + listData[i].goodsid + '" data-code="' + listData[i].itemcode + '" data-id="' + listData[i].goodsid + '" data-total="' + listData[i].applytotal + '"><span>' +listData[i].applytotal + '</span></td>';

jq部分:

	// 活动项目修改 - 项目内容更新后变更列表显示内容
	var infoLineModify = function (d, code, amount) {
		var e = code;
		var goodsid = [];//商品编号
		var count = [];//商品报销数量
		var quantity = [];//商品编号和报销数量一一对应
		var applyArr = [];//表格中的商品编号
		$("input[name=item_goods_id]").each(function () {
			var dom;
			dom = $(this).parent('td').nextAll();
			goodsid.push(dom[0].innerText);
			count.push(dom.eq(6).find('input').val())
		})

		for (var i = 0; i < goodsid.length; i++) {
			var quantityObj = {};
			quantityObj.value = goodsid[i]
			quantityObj.amount = count[i]
			quantity.push(quantityObj)
		}
		$(".applyColor").each(function () {
			if ($(this).attr('data-code') == e) {
				applyArr.push($(this).attr('data-id'))
			}
		})
		for (var i = 0; i < quantity.length; i++) {
			for (var j = 0; j < applyArr.length; j++) {
				if (quantity[i].value == applyArr[j]) {
					$('.applyColor' + '.' + code + '.' + quantity[i].value).text(quantity[i].amount)
					$('.applytotal' + '.' + code + '.' + quantity[i].value).text(amountDisplay((quantity[i].amount) * ($('.allprice' + '.' + code + '.' + quantity[i].value).text())))
				}
			}
		}
		$(".applyColor").each(function () {
		if ($(this).attr('data-code') == e) {
			var number = $(this).parent().find("td").eq(16).text()
			if(number==0){
				var td = $(this).parent('tr').find("td")
				$(td[7]).css({ "color": "#ffff80" })
			}else{
				var td = $(this).parent('tr').find("td")
				$(td[7]).css({ "color": "white" })
			}
			applyArr.push($(this).attr('data-id'))
		}
	})

	}