app/template/default/Block/header_search_form.twig line 1

Open in your IDE?
  1. {% block javascript %}
  2.     <script>
  3.     $(function() {
  4.         $(".product_btn_search").click(function(){
  5.             $(this).parent().parent().submit();
  6.         });
  8.         $(".product_btn_del").click(function(){
  9.             $(".search-form-custom").find("input[type='text'], input[type='checkbox'], select").val("");
  10.             $(this).parent().parent().submit();
  11.         });
  12.     });
  13.     </script>
  14. {% endblock %}
  16. <div class="ec-headerNaviRole__search">
  17.     {{ form_start(searchForm, {'method': 'GET', 'action': path('custom_product_search'), 'attr': {'class': 'search-form-custom row'}}) }}
  18.         <div class="ec-headerSearch__keyword search_modal_row">
  19.             <p class="search_modal_column">キーワード</p>
  20.             <div class="ec-input search_modal_column">
  21.                 {{ form_widget(searchForm.keyword, {
  22.                     'attr': {
  23.                         'class': 'form-control',
  24.                         'placeholder': '検索キーワードを入力'
  25.                     }
  26.                 }) }}
  27.             </div>
  28.         </div>
  30.         <div class="search_modal_row">
  31.             <p class="search_modal_column">
  32.                 <span>カテゴリ</span>
  33.             </p>
  34.             <ul class="search_modal_column multi_checkbox" {% if category %}style="display:block"{% endif %}>
  35.                 {% for category in searchForm.category %}
  36.                 <li>
  37.                 {{ form_widget(category, {
  38.                     'attr': {
  39.                         'class': 'form-check-input',
  40.                         'id': 'category_' ~ category.vars.value
  41.                     }
  42.                 }) }}
  43.                 </li>
  44.                 {% endfor %}
  45.             </ul>
  46.         </div>
  48.         <div class="search_modal_row custom-select">
  49.             <p class="_title02 search_modal_column">商品ステータス</p>
  50.             {{ form_widget(searchForm.category_19, {
  51.                 'attr': {
  52.                     'class': 'product_form_select search_modal_column',
  53.                 }
  54.             }) }}
  55.         </div>
  57.         <div class="search_modal_row">
  58.             <p class="_title02 search_modal_column">サイズ</p>
  59.             <ul class="product_size_checkbox search_modal_column multi_checkbox">
  60.                 {% for ClassCategory in searchForm.class_name_2 %}
  61.                 <li>
  62.                 {{ form_widget(ClassCategory, {
  63.                     'attr': {
  64.                         'class': 'form-check-input',
  65.                         'id': 'category_' ~ ClassCategory.vars.value
  66.                     }
  67.                 }) }}
  68.                 </li>
  69.                 {% endfor %}
  70.             </ul>
  71.         </div>
  73.          <div class="search_modal_row custom-select">
  74.             <p class="_title02 search_modal_column">ボディタイプ</p>
  75.             {{ form_widget(searchForm.class_name_3, {
  76.                 'attr': {
  77.                     'class': 'product_form_select search_modal_column',
  78.                 }
  79.             }) }}
  80.         </div>
  82.         <div class="search_modal_row">
  83.             <div class="search_modal_column">
  84.                 <p class="_title02 icon01">塗装</p>
  85.                 <a class="_tooltip _left" href="#" data-tooltip="ツヤありは光沢があり、ツヤなしは落ち着いたマット仕上げになります。"></a>
  86.             </div>
  87.             <ul class="product_coating_checkbox search_modal_column multi_checkbox">
  88.                 {% for category in searchForm.class_name_4 %}
  89.                 <li>
  90.                 {{ form_widget(category, {
  91.                     'attr': {
  92.                         'class': 'form-check-input',
  93.                         'id': 'category_' ~ category.vars.value
  94.                     }
  95.                 }) }}
  96.                 </li>
  97.                 {% endfor %}
  98.             </ul>
  99.         </div>
  101.         <div class="search_modal_row custom-select">
  102.             <div class="search_modal_column">
  103.                 <p class="_title02">フレット数</p>
  104.                 <a class="_tooltip" href="#" data-tooltip="弦を押さえる金属の数です。フレットが多いほど高い音まで演奏できます。"></a>
  105.             </div>
  106.             {{ form_widget(searchForm.class_name_1, {
  107.                 'attr': {
  108.                     'class': 'product_form_select search_modal_column',
  109.                 }
  110.             }) }}
  111.         </div>
  112.         <div class="search_modal_row custom-select">
  113.             <div class="search_modal_column">
  114.                 <p class="_title02">ピックアップ</p>
  115.                 <a class="_tooltip" href="#" data-tooltip="アンプにつなぐための機能です。ライブ演奏や録音にも使えます。"></a>
  116.             </div>
  117.             {{ form_widget(searchForm.class_name_5, {
  118.                 'attr': {
  119.                     'class': 'product_form_select search_modal_column',
  120.                 }
  121.             }) }}
  122.         </div>
  124.         <div class="search_modal_row">
  125.             <p class="_title02 search_modal_column">価格帯</p>
  126.             <div class="product_form_price search_modal_column">
  127.                 <div class="select_item">
  128.                     {{ form_widget(searchForm.price_min, {
  129.                         'attr': {
  130.                             'class': 'product_form_select product_form_select_price',
  131.                         }
  132.                     }) }}
  133.                     </select>
  134.                     <span class="_yen">円</span>
  135.                 </div>
  137.                 <span class="_to">〜</span>
  138.                 <div class="select_item">
  139.                     {{ form_widget(searchForm.price_max, {
  140.                         'attr': {
  141.                             'class': 'product_form_select product_form_select_price',
  142.                         }
  143.                     }) }}
  144.                     <span class="_yen">円</span>
  145.                 </div>
  146.             </div>
  147.         </div>
  149.         <div class="search_modal_row">
  150.             <p class="search_modal_column">
  151.                 <span>ライフスタイル</span>
  152.             </p>
  153.             <ul class="search_modal_column multi_checkbox" {% if category17  %}style="display:block"{% endif %}>
  154.                 {% for category in searchForm.category_17 %}
  155.                 <li>
  156.                 {{ form_widget(category, {
  157.                     'attr': {
  158.                         'class': 'form-check-input',
  159.                         'id': 'category_' ~ category.vars.value
  160.                     }
  161.                 }) }}
  162.                 </li>
  163.                 {% endfor %}
  164.             </ul>
  165.         </div>
  166.         <div class="search_modal_row">
  167.             <p class="product_btn_search btn_submit">この条件で絞り込む</p>
  168.         </div>
  169.     {{ form_end(searchForm) }}
  170. </div>