<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="zh-CN">
<head>
<title>设置***</title>
<#include "../common/inc.ftl.html"/>
<!-- Bootstrap -->
<link href="${basePath}/CacheableResource/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<script src="${basePath}/CacheableResource/bootstrap/js/html5shiv.js"></script>
<script src="${basePath}/CacheableResource/bootstrap/js/respond.min.js"></script>
<script src="${basePath}/CacheableResource/js/jquery/jquery-form.js"></script>
<script src="${basePath}/CacheableResource/js/jquery/jquery.serializejson.js"></script>
<script type="text/javascript">
$(function () {
//移到右边
$('#add').bind('click', function () {
//获取选中的选项,删除并追加给对方
$('#clauses option:selected').appendTo('#additivenotpass');
});
//双击选项
$('#clauses').bind('dblclick', function () { //绑定双击事件
//获取全部的选项,删除并追加给对方
$("option:selected", this).appendTo('#additivenotpass'); //追加给对方
});
//移到左边
$('#remove').bind('click', function () {
$('#additivenotpass option:selected').appendTo('#clauses');
var clauseid = $('#mainType option:selected').attr("id");
$.ajax({
type: "post",
async: false,
url: "${basePath}/addititive/changeClause.do",
data: "clauseid=" + clauseid,
dataType: "json",
success: function (data) {
var clauses = $("#clauses");
clauses.empty();
jQuery.each(data.clauseList, function(i,clause){
additivenotpass(clauses,clause);
});
},
error: function () {
alert("网络繁忙,请稍后再试");
}
})
});
//双击选项
$('#additivenotpass').bind('dblclick', function () {
$("option:selected", this).appendTo('#clauses'); //追加给对方
var clauseid = $('#mainType option:selected').attr("id");
$.ajax({
type: "post",
async: false,
url: "${basePath}/addititive/changeClause.do",
data: "clauseid=" + clauseid,
dataType: "json",
success: function (data) {
var clauses = $("#clauses");
clauses.empty();
jQuery.each(data.clauseList, function(i,clause){
additivenotpass(clauses,clause);
});
},
error: function () {
alert("网络繁忙,请稍后再试");
}
})
});
});
function info_submit(){
var orgid = ${orgid};
var opts = document.getElementById("additivenotpass");
for (var i = 0; opts.length > i; i++) {
opts[i].selected = true;
}
console.log(opts)
if(!opts.value) {
alert("***条款不能设置为空!");
return false;
}
$("#clauseSubmit").ajaxSubmit({
data: {"orgid": orgid},
success: function () {
alert("设置成功");
parent.zTreeOnDblClick();
},
error: function () {
alert("网络繁忙,请稍后再试");
}
})
}
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-3">
</div>
<div class="col-md-6">
<h3>选择不****条款</h3>
</div>
<div class="col-md-3">
</div>
</div>
<div class="row">
<div class="col-md-5">
<div style="float:left;">
<h4 style="font-weight:bold;">可选条款</h4>
</div>
<div style="width:300px;">
<select id="mainType" class="form-control" name="mainType" οnchange="mainTypeSelect(this)">
<option id="0" value="0">国内条款</option>
<option id="1" value="1">出口条款</option>
<option id="2" value="2">进口条款</option>
</select>
</div>
<div>
<select multiple="multiple" id="clauses" class="form-control list-group" name="clauses" style="width:300px;height:340px;">
<#list clauseList as clauseList>
<option id="${clauseList.additionalriskid}" name="display" value="${clauseList.additionalriskid}">${clauseList.clausecname}</option>
</#list>
</select>
</div>
</div>
<div class="col-md-2" style="margin-top: 100px;">
<div>
<button type="button" class="btn btn-primary" name="button" id="add">添 加>></button>
</div>
<div style="padding-top: 20px;">
<button type="button" class="btn btn-danger" name="button" id="remove"><<删 除</button>
</div>
<div style="padding-top: 20px;">
<button type="button" class="btn btn-success" name="button" id="complete" οnclick="info_submit()">提 交</button>
</div>
</div>
<div class="col-md-5">
<div>
<h4 style="font-weight:bold;">已选条款</h4>
</div>
<div>
<form id = "clauseSubmit" action="${basePath}/addititive/addititiveSubmit.do" method = "post">
<select multiple="multiple" id="additivenotpass" class="form-control list-group" name="additivenotpass" style="width:300px;height:375px;">
<#if notPassCaluseName??>
<#list notPassCaluseName as caluseName>
<option id="${caluseName.additionalriskid}" name="caluseName" value="${caluseName.additionalriskid}">${caluseName.clausecname}</option>
</#list>
<#else>
</#if>
</select>
</form>
</div>
</div>
</div>
</div>
<script>
function mainTypeSelect(t){
//可选条款value值
var clauseid = t.value;
$.ajax({
type: "post",
async: false,
url: "${basePath}/addititive/changeClause.do",
data: "clauseid=" + clauseid,
dataType: "json",
success: function (data) {
var clauses = $("#clauses");
clauses.empty();
jQuery.each(data.clauseList, function(i,clause){
additivenotpass(clauses,clause);
});
},
error: function () {
alert("网络繁忙,请稍后再试");
}
})
}
function additivenotpass(clauses,clause){
//已选择的条款与可选择的条款比较
var selected = document.getElementById("additivenotpass");
var options = selected.getElementsByTagName("option");
if(options.length!=0){
var clauseName = new Array();
for(var i = 0; i<options.length; i++){
var optionss = options[i];
var option = optionss.id;
/* var additivenotpasss = option.nodeValue; */
clauseName[i] = option;
}
if(checkEqual(clauseName,clause)){
clauses.append("<option value='"+clause.additionalriskid+"' id='"+clause.additionalriskid+"' name='"+clause.clausecname+"'>"+clause.clausecname+"</option>");
}
}else{
clauses.append("<option value='"+clause.additionalriskid+"' id='"+clause.additionalriskid+"' name='"+clause.clausecname+"'>"+clause.clausecname+"</option>");
}
}
function checkEqual(clauseName,clause){
var flag = true;
for(var i = 0; i<clauseName.length; i++){
if(clauseName[i] == clause.additionalriskid){
flag = false;
break;
}
}
return flag;
}
</script>
</body>
</html>
页面效果
最新推荐文章于 2023-04-11 23:00:00 发布