バージョン選択

フォーラム

メニュー

オンライン状況

50 人のユーザが現在オンラインです。 (38 人のユーザが フォーラム を参照しています。)
登録ユーザ: 0
ゲスト: 50
もっと...

サイト内検索

質問 > 管理機能 > 商品登録画面に商品画像とは別の画像登録機能を追加したい

管理機能

新規スレッドを追加する

フラット表示 前のトピック | 次のトピック
投稿者 スレッド
sksn
投稿日時: 2017/8/31 17:10
対応状況: −−−
新米
登録日: 2013/9/17
居住地:
投稿: 10
Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい
返信いただきありがとうございます!

上記のエラーですが、
product.twigの記述によってエラーが出たり出なかったりするので、
こっちが原因かなと思いました。
product.twigをデフォルトの状態にするとエラーは出ません。

product.twigに行った変更は以下です。

47〜177行目をコピーし、
「add_images」等の部分を「add_images_sub01」用の記述に変更

以下、少し長いですが47行目以降のソースを貼ります。

/////

$(function() {
$("#thumb").sortable({
cursor: 'move',
opacity: 0.7,
placeholder: 'ui-state-highlight',
update: function (event, ui) {
updateRank();
}
});
{% if has_class == false %}
if ($("#{{ form.class.stock_unlimited.vars.id }}").prop("checked")) {
$("#{{ form.class.stock.vars.id }}").attr("disabled", "disabled").val('');
} else {
$("#{{ form.class.stock.vars.id }}").removeAttr("disabled");
}
$("#{{ form.class.stock_unlimited.vars.id }}").on("click change", function () {
if ($(this).prop("checked")) {
$("#{{ form.class.stock.vars.id }}").attr("disabled", "disabled").val('');
} else {
$("#{{ form.class.stock.vars.id }}").removeAttr("disabled");
}
});
{% endif %}
var proto_img = ''
+ '<li class="ui-state-default">'
+ '<img src="__path__" />'
+ '<a class="delete-image">'
+ '<svg class="cb cb-close">'
+ '<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#cb-close"></use>'
+ '</svg>'
+ '</a>'
+ '</li>';
var proto_add = '{{ form_widget(form.add_images.vars.prototype) }}';
var proto_del = '{{ form_widget(form.delete_images.vars.prototype) }}';
{% for image in form.images %}
var $img = $(proto_img.replace(/__path__/g, '{{ app.config.image_save_urlpath }}/{{ image.vars.value }}'));
var $widget = $('{{ form_widget(image) }}');
$widget.val('{{ image.vars.value }}');
$("#thumb").append($img.append($widget));
{% endfor %}
{% for add_image in form.add_images %}
var $img = $(proto_img.replace(/__path__/g, '{{ app.config.image_temp_urlpath }}/{{ add_image.vars.value }}'));
var $widget = $('{{ form_widget(add_image) }}');
$widget.val('{{ add_image.vars.value }}');
$("#thumb").append($img.append($widget));
{% endfor %}
{% for delete_image in form.delete_images %}
$("#thumb").append('{{ form_widget(delete_image) }}');
{% endfor %}
var hideSvg = function () {
if ($("#thumb li").length > 0) {
$("#icon_no_image").css("display", "none");
} else {
$("#icon_no_image").css("display", "");
}
};
var updateRank = function () {
$("#thumb li").each(function (index) {
$(this).find(".rank_images").remove();
filename = $(this).find("input[type='hidden']").val();
$rank = $('<input type="hidden" class="rank_images" name="rank_images[]" />');
$rank.val(filename + '//' + parseInt(index + 1));
$(this).append($rank);
});
}
hideSvg();
updateRank();
// 画像削除時
var count_del = 0;
$("#thumb").on("click", ".delete-image", function () {
var $new_delete_image = $(proto_del.replace(/__name__/g, count_del));
var src = $(this).prev().attr('src')
.replace('{{ app.config.image_temp_urlpath }}/', '')
.replace('{{ app.config.image_save_urlpath }}/', '');
$new_delete_image.val(src);
$("#thumb").append($new_delete_image);
$(this).parent("li").remove();
hideSvg();
updateRank();
count_del++;
});
var count_add = {{ form.add_images|length|default(0) }};
$('#{{ form.product_image.vars.id }}').fileupload({
url: "{{ url('admin_product_image_add') }}",
type: "post",
dataType: 'json',
done: function (e, data) {
$('#progress').hide();
$.each(data.result.files, function (index, file) {
var path = '{{ app.config.image_temp_urlpath }}/' + file;
var $img = $(proto_img.replace(/__path__/g, path));
var $new_img = $(proto_add.replace(/__name__/g, count_add));
$new_img.val(file);
$child = $img.append($new_img);
$('#thumb').append($child);
count_add++;
});
hideSvg();
updateRank();
},
fail: function (e, data) {
alert('アップロードに失敗しました。');
},
always: function (e, data) {
$('#progress').hide();
$('#progress .progress-bar').width('0%');
},
start: function (e, data) {
$('#progress').show();
},
acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
maxFileSize: 10000000,
maxNumberOfFiles: 10,
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress .progress-bar').css(
'width',
progress + '%'
);
},
processalways: function (e, data) {
if (data.files.error) {
alert("画像ファイルサイズが大きいか画像ファイルではありません。");
}
}
});
// 画像アップロード
$('#file_upload').on('click', function () {
$('#{{ form.product_image.vars.id }}').click();
});
}); <★←ここまでは何も変更していません。デフォルトの状態です。★>

$(function() {
$("#thumb_sub01").sortable({
cursor: 'move',
opacity: 0.7,
placeholder: 'ui-state-highlight',
update: function (event, ui) {
updateRank();
}
});
{% if has_class == false %}
if ($("#{{ form.class.stock_unlimited.vars.id }}").prop("checked")) {
$("#{{ form.class.stock.vars.id }}").attr("disabled", "disabled").val('');
} else {
$("#{{ form.class.stock.vars.id }}").removeAttr("disabled");
}
$("#{{ form.class.stock_unlimited.vars.id }}").on("click change", function () {
if ($(this).prop("checked")) {
$("#{{ form.class.stock.vars.id }}").attr("disabled", "disabled").val('');
} else {
$("#{{ form.class.stock.vars.id }}").removeAttr("disabled");
}
});
{% endif %}
var proto_img = ''
+ '<li class="ui-state-default">'
+ '<img src="__path__" />'
+ '<a class="delete-image">'
+ '<svg class="cb cb-close">'
+ '<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#cb-close"></use>'
+ '</svg>'
+ '</a>'
+ '</li>';
var proto_add = '{{ form_widget(form.add_images_sub01.vars.prototype) }}';
var proto_del = '{{ form_widget(form.delete_images.vars.prototype) }}';
{% for image_sub02 in form.images_sub01 %}
var $img = $(proto_img.replace(/__path__/g, '{{ app.config.image_save_urlpath }}/{{ image_sub02.vars.value }}'));
var $widget = $('{{ form_widget(image_sub02) }}');
$widget.val('{{ image_sub02.vars.value }}');
$("#thumb_sub01").append($img.append($widget));
{% endfor %}
{% for add_image_sub01 in form.add_images_sub01 %}
var $img = $(proto_img.replace(/__path__/g, '{{ app.config.image_temp_urlpath }}/{{ add_image_sub01.vars.value }}'));
var $widget = $('{{ form_widget(add_image_sub01) }}');
$widget.val('{{ add_image_sub01.vars.value }}');
$("#thumb_sub01").append($img.append($widget));
{% endfor %}
{% for delete_image in form.delete_images %}
$("#thumb_sub01").append('{{ form_widget(delete_image) }}');
{% endfor %}
var hideSvg = function () {
if ($("#thumb_sub01 li").length > 0) {
$("#icon_no_image_sub01").css("display", "none");
} else {
$("#icon_no_image_sub01").css("display", "");
}
};
var updateRank = function () {
$("#thumb_sub01 li").each(function (index) {
$(this).find(".rank_images").remove();
filename = $(this).find("input[type='hidden']").val();
$rank_sub01 = $('<input type="hidden" class="rank_images" name="rank_images[]" />');
$rank_sub01.val(filename + '//' + parseInt(index + 1));
$(this).append($rank_sub01);
});
}
hideSvg();
updateRank();
// 画像削除時
var count_del = 0;
$("#thumb_sub01").on("click", ".delete-image", function () {
var $new_delete_image = $(proto_del.replace(/__name__/g, count_del));
var src = $(this).prev().attr('src')
.replace('{{ app.config.image_temp_urlpath }}/', '')
.replace('{{ app.config.image_save_urlpath }}/', '');
$new_delete_image.val(src);
$("#thumb_sub01").append($new_delete_image);
$(this).parent("li").remove();
hideSvg();
updateRank();
count_del++;
});
var count_add = {{ form.add_images_sub01|length|default(0) }};
$('#{{ form.product_sub01_image.vars.id }}').fileupload({
url: "{{ url('admin_product_sub01_image_add') }}",
type: "post",
dataType: 'json',
done: function (e, data) {
$('#progress_sub01').hide();
$.each(data.result.files, function (index, file) {
var path = '{{ app.config.image_temp_urlpath }}/' + file;
var $img = $(proto_img.replace(/__path__/g, path));
var $new_img = $(proto_add.replace(/__name__/g, count_add));
$new_img.val(file);
$child = $img.append($new_img);
$('#thumb_sub01').append($child);
count_add++;
});
hideSvg();
updateRank();
},
fail: function (e, data) {
alert('アップロードに失敗しました。');
},
always: function (e, data) {
$('#progress_sub01').hide();
$('#progress_sub01 .progress-bar').width('0%');
},
start: function (e, data) {
$('#progress_sub01').show();
},
acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
maxFileSize: 10000000,
maxNumberOfFiles: 10,
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress_sub01 .progress-bar').css(
'width',
progress + '%'
);
},
processalways: function (e, data) {
if (data.files.error) {
alert("画像ファイルサイズが大きいか画像ファイルではありません。");
}
}
});
// 画像アップロード
$('#file_upload_sub01').on('click', function () {
$('#{{ form.product_sub01_image.vars.id }}').click();
});
});

/////

以上になります。
何かおかしなところはあるでしょうか・・・?
よろしくお願いいたします。
フラット表示 前のトピック | 次のトピック


題名 投稿者 日時
   商品登録画面に商品画像とは別の画像登録機能を追加したい sksn 2017/8/28 16:19
     Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい 468 2017/8/29 12:26
       Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい sksn 2017/8/29 15:04
         Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい 468 2017/8/29 17:42
           Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい sksn 2017/8/30 9:55
             Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい sksn 2017/8/30 16:54
               Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい 468 2017/8/30 17:59
               » Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい sksn 2017/8/31 17:10
                   Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい 468 2017/9/6 10:39
                     Re: 商品登録画面に商品画像とは別の画像登録機能を追加したい sksn 2017/9/12 15:09

 



ログイン


EC-CUBE公式 Amazon Payプラグイン

統計情報

総メンバー数は89,075名です
総投稿数は110,023件です

投稿数ランキング

1
seasoft
7367
2
468
3217
3
AMUAMU
2712
4
nanasess
2314
5
umebius
2085
6
yuh
1819
7
h_tanaka
1646
8
red
1570
9
mcontact
1296
10
tsuji
958
11
fukap
907
12
shutta
835
13
tao_s
799
14 ramrun 789
15 karin 689
16 sumida 641
17
homan
633
18 DELIGHT 572
19
patapata
502
20
flealog
485


ネットショップの壺

EC-CUBEインテグレートパートナー

Copyright© EC-CUBE CO.,LTD. All Rights Reserved.