美文网首页
选中数据显示右边

选中数据显示右边

作者: 小羊子简述 | 来源:发表于2018-10-23 10:25 被阅读0次

<table class="table table-striped table-hover" id="table_products_sell_goods" style="border-top: 1px solid #DDAF59;">

<thead>

<tr>

<th style="width: 34px"><input type="checkbox"></th>

<th>编号</th>

<th>名称</th>

<th>全称</th>

</tr>

</thead>

<tbody>

</tbody>

<li><button class="products_btn_save_sell_goods" id="products_btn_save_sell_goods"> 保存</button></li>

<li><button class="" id="products_btn_cencel_sell_goods"> 清空</button> </li>

<li><button class="choose_product_cencel_sell_goods" id=""> 取消</button> </li>

js:

var product_name_sell_goods = []

var flag_sell_goods = true

var list_choose_sell_goods = ''

function get_product_list_sell_goods() {

// var product_name_table = ""

var product_name_input = $("#workOrder_productRelaChoose_service_sell_goods").val().trim()

var product_name_input_hidden = $("#workOrder_service_sell_goods_hidden").val().trim()

// 点击叉叉删除对应一行数据

var list_choose_sell_goods = product_name_input.split(",")

var list_choose_sell_num = product_name_input_hidden.split(",")

if(product_name_input.length != 0 && flag_sell_goods == true) {

list_choose_sell_goods.forEach(function(val, i) {

product_name_sell_goods.push({

id: list_choose_sell_num[i],

name: list_choose_sell_goods[i]

})

})

// product_name_sell_goods = $(".product_choose_input_sell_goods").val().trim().split(",");

flag_sell_goods = false

}

show_table_sell_goods(product_name_sell_goods)

input_checked_sell_goods(product_name_sell_goods)

}

function input_checked_sell_goods(clients) {

$("#table_products_sell_goods tbody input").prop("checked", false)

clients.forEach(function(Cval, i) {

if(product_name_sell_goods.indexOf(Cval) == -1) {

product_name_sell_goods.push(Cval)

}

$("#table_products_sell_goods tbody tr").each(function(i, inputVal) {

if($(inputVal).children("td:nth(2)").text() == Cval.name) {

$(inputVal).children("td:nth(0)").children().prop("checked", true)

}

})

})

}

function show_table_sell_goods(product_name_sell_goods) {

var product_name_table_sell_goods = ""

$.each(product_name_sell_goods, function(key, val) {

product_name_table_sell_goods += "<tr><td id=" + val.id + ">" + val.name + "<td class='cencel_product_sell_goods'>X</td></tr>";

})

$("#products_table_sell_goods tbody").html(product_name_table_sell_goods);

}

$(function() {

// 复选框选中或者不选事件

$(".sell_goods_info_list").on("change", "#table_products_sell_goods tbody input[type='checkbox']", function() {

var save_table_sell_goodstest = $(this).parent().parent().children().eq(2).text();

var save_table_sell_goods_hidden = $(this).parent().parent().children().eq(1).text();

var save_table_sell_goods = {

name: save_table_sell_goodstest,

id: save_table_sell_goods_hidden

};

if($(this).prop("checked")) {

product_name_sell_goods.push(save_table_sell_goods);

} else {

product_name_sell_goods.forEach(function(val, i) {

if(val.name == save_table_sell_goods.name) {

product_name_sell_goods.splice(i, 1)

}

})

}

show_table_sell_goods(product_name_sell_goods)

})

// 清空按钮涉及产品选取事件

$("#products_btn_cencel_sell_goods").click(function() {

$("#products_table_sell_goods tbody").html("");

product_name_sell_goods = []

$("#table_products_sell_goods tbody input:checked").prop("checked", "");

})

// 取消按钮涉及产品选取事件

$(".choose_product_cencel_sell_goods").click(function() {

// $(".product_choose_input_sell_goods").val(list_choose_sell_goods)

$(".sell_goods_info_list").hide();

$(".improve_serivice_request").show()

flag_sell_goods = true

})

//   如果没有数据右边没有列表

$(".products_btn_save_sell_goods").click(function() {

flag_sell_goods = true

if($("#products_table_sell_goods tbody tr").length == 0) {

$(".sell_goods_info_list").hide();

$(".improve_serivice_request").show()

$("#workOrder_productRelaChoose_service_sell_goods").val("")

$("#workOrder_service_sell_goods_hidden").val("")

} else {

var table_list_sell_goods = ""

var table_list_sell_goods_num = ""

$("#products_table_sell_goods tbody tr").each(function(i) {

var text1 = $(this).children("td:first").text();

var text2 = $(this).children("td:first").attr("id");

table_list_sell_goods += text1 + ","

table_list_sell_goods_num += text2 + ","

});

table_list_sell_goods = table_list_sell_goods.length > 0 ? table_list_sell_goods.substring(0, table_list_sell_goods.length - 1) : "";

table_list_sell_goods_num = table_list_sell_goods_num.length > 0 ? table_list_sell_goods_num.substring(0, table_list_sell_goods_num.length - 1) : "";

$("#workOrder_productRelaChoose_service_sell_goods").val(table_list_sell_goods)

$("#workOrder_service_sell_goods_hidden").val(table_list_sell_goods_num)

$(".sell_goods_info_list").hide();

$(".improve_serivice_request").show()

}

product_name_sell_goods = []

})

// 点击叉叉删除对应一行数据

$(".sell_goods_info_list").on("click", ".cencel_product_sell_goods", function() {

var save_table_sell_goods = $(this).siblings().text()

product_name_sell_goods.forEach(function(val, i) {

if(val.name == save_table_sell_goods) {

product_name_sell_goods.splice(i, 1)

}

})

$(this).parent().remove()

input_checked_sell_goods(product_name_sell_goods)

})

})

相关文章

  • 选中数据显示右边

    编号 名称 全称 保存 清空 取消 js: var product_name_sell_goods = [] va...

  • 用条件格式扮靓报表

    1、基本用法 突出显示单元格规则:选中数据-条件格式-突出显示单元格规则 快查找重复值:选中数据-条件格式-突显单...

  • MySQL:Linux / python

    linux ---MySQL mysql 登录账号 显示数据库 选中数据库 查看选中数据库里的文件 查看某个文件的...

  • 举个栗子!Tableau 技巧(137):添加操作和控制集高亮数

    在 Tableau 中,数据粉通常会使用突出显示功能,来高亮图表里被选中的数据。不过,单击选中、再单击取消,只为查...

  • iOS UITableView

    获取Cell以及获取当前选中的Cell tableview显示数据,数组为空时,tableview依然显示虚线问题...

  • 打卡23天

    数据透视表 (1) 如何插入数据透视表:选中任意数据——插入数据透视表—如需要经典模式(数据透视表选项——显示——...

  • 条件格式扮靓报表

    1.基本用法:(对象为数据) 001.突出显示单元格规则:选中数据区域——条件格式——突出显示单元格规则——(点击...

  • EXCLE 数据处理~3月精进(一)

    一、数据透视表(汇总) 步骤:1、选中任意数据单元格,点击“插入”——数据透视表——右击“选项”——显示——经典布...

  • html单选框显示值以及获取值

    获取单选框选中的值方式: 数据库字段值为1:男,0:女,怎么在页面显示对应的值呢? 三目判断 修改时显示选中状态

  • iview: 勾选表格,相互影响

    一、要实现如下的效果 左侧表格勾选,右侧表格显示左侧勾选的数据,同时右侧移除数据,左侧对应的数据显示不选中状态 h...

网友评论

      本文标题:选中数据显示右边

      本文链接:https://www.haomeiwen.com/subject/qfmniftx.html