https://fuyumi-fc.com/js/products.js

1$(function() {
2      // 規格1選択時
3      $('select[name=classcategory_id1]')
4          .change(function() {
5                      var $form = $(this).parents('form');
6                      var product_id = $form.find('input[name=product_id]').val();
7                      var $sele1 = $(this);
8                      var $sele2 = $form.find('select[name=classcategory_id2]');
9                      setClassCategories($form, product_id, $sele1, $sele2);
10                  });
11
12      // 規格2選択時
13      $('select[name=classcategory_id2]')
14          .change(function() {
15                      var $form = $(this).parents('form');
16                      var product_id = $form.find('input[name=product_id]').val();
17                      var $sele1 = $form.find('select[name=classcategory_id1]');
18                      var $sele2 = $(this);
19                      checkStock($form, product_id, $sele1.val(), $sele2.val());
20                  });
21});
22/**
23 * 規格2のプルダウンを設定する.
24 */
25function setClassCategories($form, product_id, $sele1, $sele2, selected_id2) {
26    if ($sele1) {
27        var classcat_id1 = $sele1.val() ? $sele1.val() : '';
28        if ($sele2) {
29            // 規格2の選択肢をクリア
30            $sele2.children().remove();
31
32            var classcat2;
33
34            // 商品一覧時
35            if (typeof productsClassCategories != 'undefined') {
36                classcat2 = productsClassCategories[product_id][classcat_id1];
37            }
38            // 詳細表示時
39            else {
40                classcat2 = classCategories[classcat_id1];
41            }
42
43            // 規格2の要素を設定                      
44            for (var key in classcat2) {
45                var id = classcat2[key]['classcategory_id2'];
46                var name = classcat2[key]['name'];
47                var option = $('<option />').val(id ? id : '').text(name);
48                if (id == selected_id2) {
49                    option.attr('selected', true);
50                }
51                $sele2.append(option);
52            }
53            checkStock($form, product_id, $sele1.val() ? $sele1.val() : '',
54                       $sele2.val() ? $sele2.val() : '');
55        }
56    }
57}
58
59/**
60 * 規格の選択状態に応じて, フィールドを設定する.
61 */
62function checkStock($form, product_id, classcat_id1, classcat_id2) {
63
64    classcat_id2 = classcat_id2 ? classcat_id2 : '';
65
66    var classcat2;
67
68    // 商品一覧時
69    if (typeof productsClassCategories != 'undefined') {
70        classcat2 = productsClassCategories[product_id][classcat_id1]['#' + classcat_id2];
71    }
72    // 詳細表示時
73    else {
74        classcat2 = classCategories[classcat_id1]['#' + classcat_id2];
75    }
76
77    // 商品コード
78    var $product_code_default = $form.find('[id^=product_code_default]');
79    var $product_code_dynamic = $form.find('[id^=product_code_dynamic]');
80    if (classcat2
81        && typeof classcat2['product_code'] != 'undefined') {
82        $product_code_default.hide();
83        $product_code_dynamic.show();
84        $product_code_dynamic.text(classcat2['product_code']);
85    } else {
86        $product_code_default.show();
87        $product_code_dynamic.hide();
88    }
89
90    // 在庫(品切れ)
91    var $cartbtn_default = $form.find('[id^=cartbtn_default]');
92    var $cartbtn_dynamic = $form.find('[id^=cartbtn_dynamic]');
93    if (classcat2 && classcat2['stock_find'] === false) {
94
95        $cartbtn_dynamic.text('申し訳ございませんが、只今品切れ中です。').show();
96        $cartbtn_default.hide();
97    } else {
98        $cartbtn_dynamic.hide();
99        $cartbtn_default.show();
100    }
101
102    // 通常価格
103    var $price01_default = $form.find('[id^=price01_default]');
104    var $price01_dynamic = $form.find('[id^=price01_dynamic]');
105    if (classcat2
106        && typeof classcat2['price01'] != 'undefined'
107        && String(classcat2['price01']).length >= 1) {
108
109        $price01_dynamic.text(classcat2['price01']).show();
110        $price01_default.hide();
111    } else {
112        $price01_dynamic.hide();
113        $price01_default.show();
114    }
115
116    // 販売価格
117    var $price02_default = $form.find('[id^=price02_default]');
118    var $price02_dynamic = $form.find('[id^=price02_dynamic]');
119    if (classcat2
120        && typeof classcat2['price02'] != 'undefined'
121        && String(classcat2['price02']).length >= 1) {
122
123        $price02_dynamic.text(classcat2['price02']).show();
124        $price02_default.hide();
125    } else {
126        $price02_dynamic.hide();
127        $price02_default.show();
128    }
129
130    // ポイント
131    var $point_default = $form.find('[id^=point_default]');
132    var $point_dynamic = $form.find('[id^=point_dynamic]');
133    if (classcat2
134        && typeof classcat2['point'] != 'undefined'
135        && String(classcat2['point']).length >= 1) {
136
137        $point_dynamic.text(classcat2['point']).show();
138        $point_default.hide();
139    } else {
140        $point_dynamic.hide();
141        $point_default.show();
142    }
143
144    // 商品規格
145    var $product_class_id_dynamic = $form.find('[id^=product_class_id]');
146    if (classcat2
147        && typeof classcat2['product_class_id'] != 'undefined'
148        && String(classcat2['product_class_id']).length >= 1) {
149
150        $product_class_id_dynamic.val(classcat2['product_class_id']);
151    } else {
152        $product_class_id_dynamic.val('');
153    }
154}