Support

Account

Register Login

Home › Forums › Add-ons › Options Page › Options while loop missing first item of array

Solved

Options while loop missing first item of array

  • Hello,

    When I run a while loop to output the data from a repeater field in our ‘Site Options’ field, the loop is missing the first item of the array. Any ideas why?

    Loop

    
<?php if( have_rows('services', 'option' ) ): the_row();

	// setup the unordered list
	echo '<ul>';
	while( have_rows('services', 'option' ) ): the_row();

		// variables
		$image          = get_sub_field('image');
		$service_name   = get_sub_field('service_name');
		$service_url    = get_sub_field('service_url');
		?>

		<li class="text-center header-service">
			<a href="<?php echo $service_url; ?>">
				<img src="<?php echo $image; ?>" class="border-radius" alt="<?php echo $service_name; ?>">
				<p><?php echo $service_name; ?></p>
			</a>
		</li>

		<?php
	endwhile;
	// end unordered list
	echo '</ul>';
endif; ?>

    There are only 11 list items echoed out from the loop.

    The Array from ACF Fields Viewer

    
[services] => Array
        (
            [0] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-example.jpg
                    [service_name] => Service 1
                    [service_url] => http://service.dev/services/service-1/
                )

            [1] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg
                    [service_name] => Service 2
                    [service_url] => http://service.dev/services/service-2/
                )

            [2] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-example.jpg
                    [service_name] => Service 3
                    [service_url] => http://service.dev/services/service-3/
                )

            [3] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg
                    [service_name] => Service 4
                    [service_url] => http://service.dev/services/service-4/
                )

            [4] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-example.jpg
                    [service_name] => Service 5
                    [service_url] => http://service.dev/services/service-5/
                )

            [5] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg
                    [service_name] => Service 6
                    [service_url] => http://service.dev/services/service-6/
                )

            [6] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-example.jpg
                    [service_name] => Service 7
                    [service_url] => http://service.dev/services/service-7/
                )

            [7] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg
                    [service_name] => Service 8
                    [service_url] => http://service.dev/services/service-8/
                )

            [8] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-example.jpg
                    [service_name] => Service 9
                    [service_url] => http://service.dev/services/service-9/
                )

            [9] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg
                    [service_name] => Service 10
                    [service_url] => http://service.dev/services/service-10/
                )

            [10] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-example.jpg
                    [service_name] => Service 11
                    [service_url] => http://service.dev/services/service-11/
                )

            [11] => Array
                (
                    [image] => http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg
                    [service_name] => Service 12
                    [service_url] => http://service.dev/services/service-12/
                )

        )

    Thanks!
    John

  • In case it helps, this is the outputted HTML:

    <ul>
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-2/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg" class="border-radius" alt="Service 2">
			<p>Service 2</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-3/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-example.jpg" class="border-radius" alt="Service 3">
			<p>Service 3</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-4/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg" class="border-radius" alt="Service 4">
			<p>Service 4</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-5/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-example.jpg" class="border-radius" alt="Service 5">
			<p>Service 5</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-6/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg" class="border-radius" alt="Service 6">
			<p>Service 6</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-7/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-example.jpg" class="border-radius" alt="Service 7">
			<p>Service 7</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-8/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg" class="border-radius" alt="Service 8">
			<p>Service 8</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-9/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-example.jpg" class="border-radius" alt="Service 9">
			<p>Service 9</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-10/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg" class="border-radius" alt="Service 10">
			<p>Service 10</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-11/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-example.jpg" class="border-radius" alt="Service 11">
			<p>Service 11</p>
		</a>
	</li>

	
	<li class="text-center header-service">
		<a href="http://service.dev/services/service-12/">
			<img src="http://service.dev/wp-content/uploads/2015/08/service-aircraft.jpg" class="border-radius" alt="Service 12">
			<p>Service 12</p>
		</a>
	</li>

</ul>

  • It is because you are calling the_row() twice before you show the first item

    
// the_row() in the next line sets up the first row
<?php if( have_rows('services', 'option' ) ): //the_row(); // remove this one

	// setup the unordered list
	echo '<ul>';
// the_row() in this line increments row to the next one
	while( have_rows('services', 'option' ) ): the_row();

  • Ahhh rookie move on my end! Thanks so much, John.

  • Happens all the time, especially when you’ve been looking at it too long and you’re eye goes right paste it the errors. Been there many times.

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Options while loop missing first item of array’ is closed to new replies.