대표 이미지 업로드 처리...

dev_bert
kyebyungha 3 years ago
parent f4f071fcdc
commit c833fefe95

@ -129,7 +129,6 @@
<audio src="/m/" controls id="audio_control" style="width: 100%; display:none"></audio>
<script>
var swiper = new Swiper('.swiper-container', {
slidesPerView: 'auto',
slidesPerGroup: 1,

@ -90,7 +90,7 @@
</div>
</div>
</div>
<#assign pick_img_index = pick_img_index+1>
<#assign pick_hosp_index = pick_hosp_index+1>
</#if>
<button type="button" id="add_pic_btn" name="" class="add_pic_btn" onclick="javascript:add_hosp_file();">
사진 추가하기 버튼 <span></span> <span></span>
@ -101,30 +101,83 @@
</div>
<!-- //검진 기록/처방전 첨부 -->
<script type="text/javascript">
$(function(){
$("div.nutrition_kinds_basic02>div").find(".p_input_box>input").bind('input', function(event){
$("#"+event.target.id.replace("ipt","")).val(this.value);
});
});
// 검진, 질환 탭 토글 이벤트
$(".type_tab>li").click(function (e) {
e.stopPropagation();
<script type="text/javascript">
$(function(){
$("div.nutrition_kinds_basic02>div").find(".p_input_box>input").bind('input', function(event){
$("#"+event.target.id.replace("ipt","")).val(this.value);
});
$(document).on('click', '.input_file_upload .btn_upfile', function(){
$(this).siblings('.upfile').trigger('click');
});
$(document).on('click', '.input_file_upload .ibtn_x', function(){
$(this).parent().parent().remove();
});
$(document).on('change', ".input_file_upload input[type=file]", function(){
var file = $(this)[0].files[0];
//console.log(file.name + "\n" + file.type + "\n" + file.size + "\n" + file.lastModifiedDate); // upfile var
if ($(this).hasClass('file_mypage')) {
$(this).talkImage(file, '.add_thumb');
}else{
$(this).displayImage(file, '.add_thumb');
} $(this).siblings('.add_thumb').removeClass('off').siblings('.ibtn_x').removeClass('off');
});
$.fn.extend({
// Upload preview Function
displayImage : function(file, classname) {
if (typeof FileReader !== "undefined") {
// var container = document.getElementsByClassName(classname),
// img = document.createElement("img"),
// reader;
$(this).siblings(classname).find('img').remove();
var container = $(this).siblings(classname),
img = document.createElement("img"),
reader;
img.setAttribute('width', '100%'),
img.setAttribute('height', '100%'),
if (!$(this).hasClass("current")) {
$(this).siblings().removeClass("current");
$(this).addClass("current");
}
});
container.append(img);
reader = new FileReader();
reader.onload = (function (theImg) {
return function (evt) {
theImg.src = evt.target.result;
};
}(img));
reader.readAsDataURL(file);
}
},
});
});
// 검진, 질환 탭 토글 이벤트
$(".type_tab>li").click(function (e) {
e.stopPropagation();
var pick_hosp_index = "${pick_hosp_index!'0'}";
if (!$(this).hasClass("current")) {
$(this).siblings().removeClass("current");
$(this).addClass("current");
}
});
var pick_hosp_index = "${pick_hosp_index!'0'}";
function add_hosp_file(){
if( $(".add_pic_list_item").length > 4) {
Swal.fire({text: '최대 5개 이미지만 가능 합니다.'});
return;
}
var add_pic_tags = '<div class="add_pic_list_item">' +
'<div class="input_file_upload">' +
'<input type="file" id="append_hosp_img_file_' + pick_img_index + '" name="append_hosp_img_file_' + pick_img_index + '" accept="image/*;capture=camera" class="upfile">' +
'<input type="file" id="append_hosp_img_file_' + pick_hosp_index + '" name="append_hosp_img_file_' + pick_hosp_index + '" accept="image/*;capture=camera" class="upfile">' +
'<button type="button" class="btn_upfile"></button>' +
'<div id="add_thumb" class="add_thumb">' +
'<img src="${URL_STATIC_ROOT}/m/img/community/upload_img.jpg" alt="사진추가하기">' +
@ -145,59 +198,7 @@
$(this).addClass("active");
}
});
/*********사진 추가*********/
$(function() {
// File Upload + Preview
$(document).on('click', '.input_hosp_file_upload .btn_upfile', function(){
$(this).siblings('.upfile').trigger('click');
});
$(document).on('click', '.input_hosp_file_upload .ibtn_x', function(){
$(this).parent().parent().remove();
});
$(document).on('change', ".input_file_upload input[type=file]", function(){
var file = $(this)[0].files[0];
//console.log(file.name + "\n" + file.type + "\n" + file.size + "\n" + file.lastModifiedDate); // upfile var
if ($(this).hasClass('file_mypage')) {
$(this).talkImage(file, '.add_thumb');
}else{
$(this).displayImage(file, '.add_thumb');
} $(this).siblings('.add_thumb').removeClass('off').siblings('.ibtn_x').removeClass('off');
});
$.fn.extend({
// Upload preview Function
displayImage : function(file, classname) {
if (typeof FileReader !== "undefined") {
// var container = document.getElementsByClassName(classname),
// img = document.createElement("img"),
// reader;
$(this).siblings(classname).find('img').remove();
var container = $(this).siblings(classname),
img = document.createElement("img"),
reader;
img.setAttribute('width', '100%'),
img.setAttribute('height', '100%'),
container.append(img);
reader = new FileReader();
reader.onload = (function (theImg) {
return function (evt) {
theImg.src = evt.target.result;
};
}(img));
reader.readAsDataURL(file);
}
},
});
});
</script>
</script>
<#include "/m/bf_daily_nutrition/include_bottom.ftl">
Loading…
Cancel
Save