Buy Now
Sign in

Loading more than 1 line for checkbox group (using dynamic/dropdown data)

mapme 97
November 14 2018 #381504
We are using a form wizard Checkbox Group to load records from an array. The wizard generates something that loads the records in a recurring single line. So everything works perfectly, however in some cases our users have over 50 items displaying in the checkbox group so there's a lot of scrolling. Is it possible to change the load order so that they will display across three rows? That would reduce the scrolling from 50 rows to 17 rows. The code from the wizard we are using is as follows:
<div class="ccms_form_element cfdiv_checkboxgroup radios_over" id="target_tag_container_div" style=""><label for="target_tag" style="color: #dd5645; size:24px !important;">Target Parents<BR>& Stakeholders<BR>by Tag:</label><input type="hidden" name="target_tag" value="" alt="ghost" />
<div style="float:left; clear:none;">

<input type="checkbox" name="target_tag
  • " onchange="checkertags()" id="target_tag_all" title="" value="tag_all" class="" />
    <label for="target_tag_all"><span style="font-weight:bold; color: #red;">Send to all tags</span></label>

    $options_data = $form->get_array_value($form->data, explode(".", "tag"));
    if(!is_null($options_data) && is_array($options_data)){
    $f_id = 0;
    foreach($options_data as $option_data){
    if(isset($option_data["tag_uid"]) && isset($option_data["tag_name"])){
    echo '<input onchange="checkertags()" type="checkbox" name="target_tag
  • " id="target_tag_'.$option_data["tag_uid"].'" title="" value="'.$option_data["tag_uid"].'"'.(in_array($option_data["tag_uid"], array (
    0 => '',
    )) ? ' checked="checked"' : '').' class="" />'."\n";
    echo '<label for="target_tag_'.$f_id.'"><span >'.$option_data["tag_name"].'</span></label> '."\n";
    </div><div class="clear"></div><div id="error-message-target_tag"></div></div><div class="ccms_form_element cfdiv_empty" id="empty_container_div" style=""><div class="clear"></div><div id="error-message-empty"></div></div>
    Thanks a lot.
    GreyHead 63.4
    November 14 2018 #381508
    Hi mapme,
    You can change the layout to Horizontal and, if necessary, use CSS to restrict the maximum width. That should work and be easier to use but may not be very tidy.
    Or, you can use custom HTML and lay the checkboxes out in columns using a table - or any other CSS+HTML that you like
    ChronoForms technical support
    If you'd like to buy me a coffee or two, thank you very much
    healyhatman 5.7
    November 14 2018 #381514
    Web developer at
    I don't work for ChronoEngine but I do accept donations

    You can now copy+paste code from forums