0

i have this html mark-up to sort some data

<div class="row">
<div class="col-xs-2">
  <img src="images/member-schools/ms1.jpg" class="img-responsive">
</div>
<div class="col-xs-4">
  <h4>American International School - East</h4>
</div>
<div class="col-xs-2">
  <img src="images/member-schools/ms2.jpg" class="img-responsive">
</div>
<div class="col-xs-4">
  <h4>Dover American International School</h4>
</div>

and i am pulling out the data from repeatable group metabox i use from CMB2

this is the code for the registered metabox

function schools() {

// Start with an underscore to hide fields from custom fields list
$prefix = 'schools_';

/**
 * Repeatable Field Groups
 */
$schools= new_cmb2_box( array(
    'id'           => $prefix . 'metabox',
    'title'        => __( 'schools', 'cmb2' ),
    'object_types' => array( 'page', ),
    'show_on'      => array( 'key' => 'id', 'value' => 6 ),
    'closed'     => true,
) );

$group_field_id = $schools->add_field( array(
    'id'          => $prefix . 'field',
    'type'        => 'group',
    'options'     => array(
        'group_title'   => __( 'Slide {#}', 'cmb2' ), // {#} gets replaced by row number
        'add_button'    => __( 'Add Another Slide', 'cmb2' ),
        'remove_button' => __( 'Remove Slide', 'cmb2' ),
        'sortable'      => true, // beta
    ),
) );


$schools->add_group_field( $group_field_id, array(
    'name' => __( 'Photo', 'cmb2' ),
    'id'   => 'photo',
    'type' => 'file',
) );

$schools->add_group_field( $group_field_id, array(
    'name' => __( 'Name', 'cmb2' ),
    'id'   => 'name',
    'type' => 'text',
) );}

i pull the data out through this code

$schools = get_post_meta( get_the_ID(), 'schools_field', true );

where $schools is an array that contain an image and title for each entry which i can loop through to pull out the values. my question is how i can add <div class="row"> every two items from that array , because i need a row for each two entries

EDIT: var_dump result

array(3) {
    [0] => array(3) {
        ["photo_id"]    => string(2) "89"
        ["photo"]       => string(56) "http://localhost/NCSR/wp-content/uploads/2015/06/ms3.jpg"
        ["name"]        => string(8) "School 1" 
    }
    [1] => array(3) {
        ["photo_id"]    => string(2) "88"
        ["photo"]       => string(56) "http://localhost/NCSR/wp-content/uploads/2015/06/ms2.jpg"
        ["name"]        => string(8) "school 2"
    }
    [2] => array(3) {
        ["photo_id"]    => string(2) "87"
        ["photo"]       => string(56) "http://localhost/NCSR/wp-content/uploads/2015/06/ms1.jpg"
        ["name"]        => string(8) "school 3"
    } 
}
  • Please post structure of the array $schools. A var_dump($schools) will be great. – Omar Tariq Jun 6 '15 at 19:02
  • edited the code to add the metabox structure – Mohamed Mokhtar Jun 6 '15 at 19:11
  • 1
    I appreciate your efforts, but I would like you to please post the result of var_dump($schools) for me to quickly answer your question. – Omar Tariq Jun 6 '15 at 19:17
  • edited the post to inculde vardumb result , i appreciate your help – Mohamed Mokhtar Jun 6 '15 at 19:46
0

I found out a way to do this , turned out to be kind of easy here is what i did

$Aschools = get_post_meta( get_the_ID(), 'american_member_schools_field', true );

$i = 0;

$entries = count($Aschools);

foreach ( (array) $Aschools as $key => $Aschool ) {

  $logo = $Aname = '';

  $i++;


  if ( isset( $Aschool['name'] ) )
      $Aname =  $Aschool['name'] ;

  if ( isset( $Aschool['logo_id'] ) ) {
      $logo = wp_get_attachment_image( $Aschool['logo_id'], 'full', null, array(
          'class' => 'img-responsive',
      ) );
  }

  // Do something with the data

  if ($i & 1) {
    echo '<div class="row row-eq-height">';
    echo '<div class="col-xs-2">';
    echo $logo;
    echo '</div>';
    echo '<div class="col-xs-4">';
    echo '<h4>' . $Aname . '</h4>';
    echo '</div>';
  } elseif ($i & 1 && $i == $entries) {
    echo '<div class="row row-eq-height">';
    echo '<div class="col-xs-2">';
    echo $logo;
    echo '</div>';
    echo '<div class="col-xs-4">';
    echo '<h4>' . $Aname . '</h4>';
    echo '</div>';
    echo '</div>';
  } else {
    echo '<div class="col-xs-2">';
    echo $logo;
    echo '</div>';
    echo '<div class="col-xs-4">';
    echo '<h4>' . $Aname . '</h4>';
    echo '</div>';
    echo '</div>';
  }
}
0
display_schools($string);

function display_schools($string) {
    $counter = 0;
    $i = 0;
    $len = count($string);
    foreach($string as $school) {
        if($counter == 0) {
            echo '<div class="row">';
        }
        ?>
            <div class="col-xs-2">
              <img src="<?php echo $school['photo']; ?>" class="img-responsive photo_id_<?php echo $school['photo_id']; ?>">
            </div>
            <div class="col-xs-4">
              <h4><?php echo $school['name']; ?></h4>
            </div>
        <?php
        if($counter == 1 || $i == $len - 1) {
            echo '</div>';
            $counter = 0;
        } else {
            $counter = $counter + 1;    
        }

        $i++;
    }
}
  • nice logic i like the way you did it , much cleaner code than my answer and practical to use on other templates , i will give it a try , i will appreciate it if you can tell me what do you think about my answer , is there something i am missing or did not think about ? – Mohamed Mokhtar Jun 6 '15 at 22:41
  • I've not fully analyzed your code actually. But, I see 2 problems when skimmed through. Number 1: iterator $i is normally updated just before the loop ends. Number 2: You should be displaying rows when $i is even. So the condition for it should be if(!($i & 1)). I've not fully reviewed your code. – Omar Tariq Jun 6 '15 at 22:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.