问题描述:
点击上传,选择文件上传,是可以获取到 lay-data 的值传递到后端
但拖拽上传图片,获取不到 lay-data 的值
解决方法:
添加隐藏域,记录操作的值
<input type="hidden" value="" id="deliver-id">
拖拽上传赋值
$(".deliver-img").on('drop',function(e){
e.preventDefault();
$("#deliver-id").val($(this).attr('lay-data'));
})
$(".deliver-img").on('dragover',function(e){
e.preventDefault();
})
点击上传赋值
οnclick="$('#deliver-id').val({$goods_list.id})"
全部代码:
运单号:
<input type="hidden" value="" id="deliver-id">
<div class="layui-inline">
{if !empty($goods_list['store_deliver_number']) && strpos($goods_list['store_deliver_number'], 'http') === 0}{else}
<input type="text" class="layui-input deliver-input{$goods_list.id}" value="{$goods_list.store_deliver_number}" style="width: 130px;" placeholder="填写发货运单号" onblur="changeStoreDeliver($(this),{$goods_list.id},{$goods_list.order_id})">
{/if}
{if (!empty($goods_list['store_deliver_number']) && strpos($goods_list['store_deliver_number'], 'http') === 0) || empty($goods_list['store_deliver_number'])}
<div class="outer deliver-box" style="width: 60px;float: right;">
<img src="/static/home/images/close.png" class="close close{$goods_list.id} {if $orderInfo.nameplate_img}show{/if}" onclick="delDeliverImg({$goods_list.id})" style="right: 20px;top: 0px;width: 15px;height: 15px;{if $goods_list.store_deliver_number}display:inline;{/if}">
<div class="left_epc image-list" style="float: left;padding:0;height: 30px;background-color: #fff;">
<div class="layui-upload">
<blockquote class="layui-elem-quote layui-quote-nm" style="float: left;border-style: none;padding:0px;">
<div class="layui-upload-list{$goods_list.id}" style="margin:0px;margin-top: 10px;">
{if $goods_list.store_deliver_number}
<a href="{$goods_list.store_deliver_number}" target="_blank"><img class="deliver-src" src="{$goods_list.store_deliver_number}" style="width: 30px;height: 30px;" /></a>
{/if}
</div>
</blockquote>
{if empty($goods_list.store_deliver_number)}
<div class="layui-upload-drag deliver-img" lay-data="{$goods_list.id}" onclick="$('#deliver-id').val({$goods_list.id})" style="padding:0px;width: 30px;height: 30px;line-height: 32px;font-size: 20px;margin-left:10px;" title="点击上传快递单图片或拖拉图片上传">
<p>+</p>
</div>
{/if}
</div>
</div>
</div>
{/if}
</div>
$(".deliver-img").on('drop',function(e){
e.preventDefault();
$("#deliver-id").val($(this).attr('lay-data'));
})
$(".deliver-img").on('dragover',function(e){
e.preventDefault();
})
layui.use('upload', function(){
var $ = layui.jquery
,upload = layui.upload;
// 上传运单图
upload.render({
elem: '.deliver-img'
,url: "{:url('admin/Xsorder/ajaxUploadDeliver')}"
,done: function(res){
var id = $("#deliver-id").val();
var imgurl = res.data.imgurl;
$.ajax({
url:"{:url('admin/Xsorder/ajaxSetDeliver')}",//发送的路径
data:{id:id,img_url:imgurl},//发送的数据
type:"post",//发送的方式
dataType:"json",//服务器返回的数据类型
success: function(res2) {
if(res2.code==200){
$('.deliver-input'+id).hide();
$('.deliver-box .close'+id).show();
$('.deliver-box .layui-upload-list'+id).html('<a href="'+res2.data.imgurl+'" target="_blank"><img class="deliver-src" src="'+res2.data.imgurl+'" style="width: 30px;height: 30px;" /></a>');
layer.msg('上传成功');
}else{
layer.msg(data.msg);
}
},
error: function (data){
layer.msg('网络错误,请稍后重试');
}
});
}
});
});