Forum for discussing general topics related to Couch.
2 posts Page 1 of 1
Not sure if I am being really stupid here but put iconfonts into another page so the user can select which icon they want to use, I have not done any different apart from change the repeatable region and editable names but the code is the same apart from that but for some reason, the icons are not showing in the admin side for the first row but if I add a row, they show but then if I save it and go into the section again, they don't show again. Can someone look for me please to see if I am missing anything as been looking at the coding for ages now and not spotting anything

Code: Select all
<cms:editable name='service_info_section' label='Service Info Section' type='group' collapsed='1' order='2'>
<cms:repeatable name='services_info_boxes' label='Services Info Boxes' group='service_info_section'>
<cms:editable name='services_icons' label='Service Icon' order='0' dynamic='opt_values' opt_values='iconfonts.html' type='dropdown' />
<cms:editable type='text' name='service_info_heading' label='Service Info Heading' group='service_info_section' />
<cms:editable type='richtext' toolbar='full' name='service_info_text' label='Service Info Text' group='service_info_section' />
</cms:repeatable>
</cms:editable>

<cms:editable name='icons_assets' type='message' order='3'>
<link href="addons/chosen/chosen.css" rel="stylesheet" type="text/css">

<style>

@font-face {
  font-family: 'computer';
  src:  url('http://www.apexcomputersystems.co.uk/iconfont/fonts/computer.eot?pkh0gr');
  src:  url('http://www.apexcomputersystems.co.uk/iconfont/fonts/computer.eot?pkh0gr#iefix') format('embedded-opentype'),
    url('fhttp://www.apexcomputersystems.co.uk/iconfont/fonts/computer.ttf?pkh0gr') format('truetype'),
    url('http://www.apexcomputersystems.co.uk/iconfont/fonts/computer.woff?pkh0gr') format('woff'),
    url('http://www.apexcomputersystems.co.uk/iconfont/fonts/computer.svg?pkh0gr#computer') format('svg');
  font-weight: normal;
  font-style: normal;
}
         [class^="icon-"] ~ .chosen-container, [class*=" icon-"] ~ .chosen-container,
            select[id$=-services_icons] ~ .chosen-container {
                width: 100% !important;
                min-width: 240px;
                font-family: 'computer' !important;
                font-size: 14px;
                text-rendering: auto;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
            }

            .chosen-container ~ .select-caret { display: none; }
            .chosen-container > a { font-weight: normal; }

            .tableholder { overflow: visible; }
      </style>
      
      <script src="addons/chosen/chosen.jquery.min.js"></script>
       
        <script>
            $(function() {
                $(".icon-, #services_info_boxes select[id$=-services_icons]").chosen();

                $("#addRow_f_services_info_boxes").on("click", function() {
                    $("#f_services_info_boxes select[id$=-services_icons]:last").chosen();
                });
            });
      </script>
      
</cms:editable>


Code: Select all
<cms:show_repeatable 'services_info_boxes' startcount='0' >
                <cms:if k_count lt '2'>
               <div class="col-sm-6 grey-box">
                  <div class="grey-box-inside">
                     <div class="grey-box-icon"><i class="icon <cms:show services_icons/>"></i></div>
                     <div class="grey-box-text">
                        <h4 class="grey-box-title"><cms:show service_info_heading/></h4>
                        <cms:show service_info_text/>
                     </div>
                  </div>
               </div>
                    </cms:if>
               </cms:show_repeatable>
Sorry spotted the mistake, I was missing a f_ in the javascript line below

Code: Select all
$(".icon-, #services_info_boxes select[id$=-services_icons]").chosen();


so amended it to the line below and is ok now

Code: Select all
$(".icon-, #f_services_info_boxes select[id$=-services_icons]").chosen();
2 posts Page 1 of 1
cron