Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Advanced Custom Fields | Modify my code to work with Repeater WordPress

  • SOLVED

Hi,

I have a webshop that sells digital customized products to customers (WooCommerce).

The customer can get his product as text, audio or video.

I have build the following custom fields on the customers order pages which allows me to insert or upload the customers text, audio or video to their order.
[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_24_15.png"]][[/LINK]]

I have then added this code to the customers order page (/woocommerce/templates/order/order-details.php) to display the message:
http://pastebin.com/5ddSAVDK

Since some customers are ordering more than one product, I need to wrap the entire custom field into using the repeater field for ACF.

I have already build the repeater custom fields, but I cannot get it to display on the order-details.php page.
The new custom fields looks like this:
[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_28_08.png"]][[/LINK]]

What I need is someone who can modify my existing code display the new repeater custom fields.

2014-06-06 by cruiseback

Answers (4)

2014-06-06

Remy answers:

[[LINK href="https://gist.github.com/Tabrisrp/b861b430b86e869873ad"]]https://gist.github.com/Tabrisrp/b861b430b86e869873ad[[/LINK]]

Replace 'repeater_field' with the name of your repeater field

cruiseback comments:

Hi Remy,

Thanks, however I am getting a syntax error when using your code?

Thanks, cb

cruiseback comments:

Just realized that wpquestions stripped away my initial links to my screenshots. Will try to add them once more:

[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_24_15.png"]]Current custom fields[[/LINK]]

[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_28_08.png"]]New custom fields with repeater[[/LINK]]

Thanks, cb

cruiseback comments:

I fixed the syntax errors myself..

if ( have_rows( 'orders' ) :
while ( have_rows( 'orders' ) : the_row();

should be..

if ( have_rows( 'orders' )) :
while ( have_rows( 'orders' )) : the_row();

However, your code does not work, nothing is being displayed on the order-details.php page.

Thanks, cb

Remy comments:

Should the conditional logic setting really be on "yes" ?

cruiseback comments:

I can't see what good that would do?

There are no toggle fields for the conditional logic to work with.

Remy comments:

That's why I'm asking, on the screenshot it's on yes, which could explain why it's not showing up

cruiseback comments:

Ah right, now I understand. Hadn't seen that it was switched on. I's off now, but still nothing is displayed when using your code.

It basically outputs nothing on the order-details.php page, even though I have added one of each type on an order.

Remy comments:

And I guess it was working fine before you switched to the repeater ?

cruiseback comments:

Yes, absolutely, I still have that code in place as well and its working just fine.

Remy comments:

I updated my gist with some checks to see where it's failling, please try it

cruiseback comments:

I'm getting syntax errors with that code?

Remy comments:

Forgot a : around the end

cruiseback comments:

Ok, added it now and I am getting "have rows not working"

Remy comments:

Seems acf has no data, can you do a screenshot of the admin page fields for this order ?

cruiseback comments:

Sure, [[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen%20Shot%202014-06-07%20at%2000.42.50.png"]]here it is[[/LINK]].

Remy comments:

New try, I updated my gist once more, since I think we're not in the post loop, we need to pass an id to the have_rows() function

cruiseback comments:

Still displaying "have rows not working" after I updated the code.

I can see now that I should have put a higher price for this job, I just though that it was a very simple task since ACF seems very well documented.

Remy comments:

This is getting hard to debug without access to the website. You can increase the price for this if needed

cruiseback comments:

YAAAAAAAAAAYYY!! It finally woked.

I had forgotten to change 'repeater_fields' to 'orders' in your gist when I replaced it.

Great work.

Remy comments:

Fantastic

2014-06-06

Fahad Murtaza answers:

Can do this quick.

cruiseback comments:

Sure, go ahead.

Thanks, cb

2014-06-06

smc answers:

what's name of your fields and repeater subfield ?

cruiseback comments:

Please check these links, wpquestions.com stripped them out from my first post.

[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_24_15.png"]]Current custom fields[[/LINK]]

[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_28_08.png"]]New custom fields with repeater[[/LINK]]

Thanks, cb

2014-06-07

Romel Apuya answers:

Hi,

Please refer to this guide on ACF repeaters

[[LINK href="http://www.advancedcustomfields.com/resources/field-types/repeater/"]]http://www.advancedcustomfields.com/resources/field-types/repeater/[[/LINK]]

Romel Apuya comments:

Please add the image on how the repeater looks.

cruiseback comments:

[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_24_15.png"]]Current custom fields[[/LINK]]

[[LINK href="https://dl.dropboxusercontent.com/u/2666961/Screen_Shot_2014-06-06_at_21_28_08.png"]]New custom fields with repeater[[/LINK]]

wpquestions.com stripped out the links from my original post.

Thanks, cb

Romel Apuya comments:

I dont think u need the type field
here's the code i have

if( have_rows('orders') ):
// loop through the rows of data
while ( have_rows('orders') ) : the_row();
$tekst_value = get_sub_field('tekst');
$memo_value = get_sub_field('memo');
$video_value = get_sub_field('video');
<?php if( $tekst_value != '' ){ ?>
<div id="customerMessageTxt">
<?php echo $tekst_value; ?>
</div>
<?php } ?>

<?php if( $memo_value != '' ){ ?>
<div id="customerMessageMemo">
<audio id="wp_mep_1" src="<?php echo $memo_value; ?>" type="audio/mp3" controls="controls" preload="auto" >
<object width="709" height="50" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $memo_value; ?>" />
</object>
</audio>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1

,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
,audioWidth:709,audioHeight:50
});
});
</script>
</div>
<?php } ?>
<?php if( $video_value != '' ){ ?>
<div id="customerMessageVideo">
<video id="wp_mep_1" src="<?php echo $video_value; ?>" type="video/mp4" width="709" height="399" controls="controls" preload="true" >
<object width="709" height="399" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $video_value; ?>" />
</object>
</video>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']

});
});
</script>
</div>
<?php } ?>
endwhile;
else :
// no rows found
endif;

cruiseback comments:

I tried using your code (after correcting the syntax errors) but nothing is displayed on the order page.

cb

Romel Apuya comments:

try this
<?php
if( have_rows('orders') ):
// loop through the rows of data
while ( have_rows('orders') ) : the_row();
$tekst_value = get_sub_field('tekst');
$memo_value = get_sub_field('memo');
$video_value = get_sub_field('video');
if( $tekst_value != '' ){
?>
<div id="customerMessageTxt">
<?php echo $tekst_value; ?>
</div>
<?php
}
if( $memo_value != '' ){
?>
<div id="customerMessageMemo">
<audio id="wp_mep_1" src="<?php echo $memo_value; ?>" type="audio/mp3" controls="controls" preload="auto" >
<object width="709" height="50" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $memo_value; ?>" />
</object>
</audio>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
,audioWidth:709,audioHeight:50
});
});
</script>
</div>
<?php }
if( $video_value != '' ){?>
<div id="customerMessageVideo">
<video id="wp_mep_1" src="<?php echo $video_value; ?>" type="video/mp4" width="709" height="399" controls="controls" preload="true" >
<object width="709" height="399" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $video_value; ?>" />
</object>
</video>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
});
});
</script>
</div>
<?php }
endwhile;
else :
// no rows found
endif;
?>

cruiseback comments:

Still nothing is displayed. Maybe the repeater field is set up wrong, I'm not sure.

Romel Apuya comments:

Maybe you can post the code you have when it was working?

Romel Apuya comments:

why you have a field named type? which is a select
then testing if the field type is text,memo or video??

cruiseback comments:

The code I use normally is in my original post.

Romel Apuya comments:

Is that the full code from
order-details.php page??

Romel Apuya comments:

last try:

<?php if(get_field('orders', $order_id)): ?>
<?php while(has_sub_field('orders', $order_id)): ?>
$tekst_value = get_sub_field('tekst',$order_id);
$memo_value = get_sub_field('memo',$order_id);
$video_value = get_sub_field('video',$order_id);
if( $tekst_value != '' ){
?>
<div id="customerMessageTxt">
<?php echo $tekst_value; ?>
</div>
<?php
}
if( $memo_value != '' ){
?>
<div id="customerMessageMemo">
<audio id="wp_mep_1" src="<?php echo $memo_value; ?>" type="audio/mp3" controls="controls" preload="auto" >
<object width="709" height="50" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $memo_value; ?>" />
</object>
</audio>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
,audioWidth:709,audioHeight:50
});
});
</script>
</div>
<?php }
if( $video_value != '' ){?>
<div id="customerMessageVideo">
<video id="wp_mep_1" src="<?php echo $video_value; ?>" type="video/mp4" width="709" height="399" controls="controls" preload="true" >
<object width="709" height="399" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $video_value; ?>" />
</object>
</video>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
});
});
</script>
</div>
<?php }
<?php endwhile; ?>
<?php endif; ?>

Romel Apuya comments:

if that code above wont work.. try this one

<?php if(get_field('orders', $order_id)): ?>
<?php while(has_sub_field('orders', $order_id)): ?>
$type_value = get_sub_field('type',$order_id);
if( $type_value === 'tekst' ){
$tekst_value = get_sub_field('tekst',$order_id);
?>
<div id="customerMessageTxt">
<?php echo $tekst_value; ?>
</div>
<?php
}
else if( $type_value === 'memo' ){
$memo_value = get_sub_field('memo',$order_id);
?>
<div id="customerMessageMemo">
<audio id="wp_mep_1" src="<?php echo $memo_value; ?>" type="audio/mp3" controls="controls" preload="auto" >
<object width="709" height="50" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $memo_value; ?>" />
</object>
</audio>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
,audioWidth:709,audioHeight:50
});
});
</script>
</div>
<?php }
else( $type_value === 'video' ){
$video_value = get_sub_field('video',$order_id);
?>
<div id="customerMessageVideo">
<video id="wp_mep_1" src="<?php echo $video_value; ?>" type="video/mp4" width="709" height="399" controls="controls" preload="true" >
<object width="709" height="399" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $video_value; ?>" />
</object>
</video>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
});
});
</script>
</div>
<?php }
<?php endwhile; ?>
<?php endif; ?>

cruiseback comments:

I am getting syntax errors on both your snippets.

Romel Apuya comments:

sorry here

<?php if(get_field('orders', $order_id)): ?>

<?php while(has_sub_field('orders', $order_id)):

$type_value = get_sub_field('type',$order_id);

if( $type_value === 'tekst' ){

$tekst_value = get_sub_field('tekst',$order_id);

?>

<div id="customerMessageTxt">

<?php echo $tekst_value; ?>

</div>

<?php

}

else if( $type_value === 'memo' ){

$memo_value = get_sub_field('memo',$order_id);

?>

<div id="customerMessageMemo">

<audio id="wp_mep_1" src="<?php echo $memo_value; ?>" type="audio/mp3" controls="controls" preload="auto" >

<object width="709" height="50" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">

<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />

<param name="flashvars" value="controls=true&amp;file=<?php echo $memo_value; ?>" />

</object>

</audio>

<script type="text/javascript">

jQuery(document).ready(function($) {

$('#wp_mep_1').mediaelementplayer({

m:1

,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']

,audioWidth:709,audioHeight:50

});

});

</script>

</div>

<?php }

else( $type_value === 'video' ){

$video_value = get_sub_field('video',$order_id);

?>

<div id="customerMessageVideo">

<video id="wp_mep_1" src="<?php echo $video_value; ?>" type="video/mp4" width="709" height="399" controls="controls" preload="true" >

<object width="709" height="399" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">

<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />

<param name="flashvars" value="controls=true&amp;file=<?php echo $video_value; ?>" />

</object>

</video>

<script type="text/javascript">

jQuery(document).ready(function($) {

$('#wp_mep_1').mediaelementplayer({

m:1

,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']

});

});

</script>

</div>

<?php }

<?php endwhile; ?>

<?php endif; ?>

Romel Apuya comments:

<?php if(get_field('orders', $order_id)): ?>
<?php while(has_sub_field('orders', $order_id)):
$type_value = get_sub_field('type',$order_id);
if( $type_value === 'tekst' ){
$tekst_value = get_sub_field('tekst',$order_id);
?>
<div id="customerMessageTxt">
<?php echo $tekst_value; ?>
</div>
<?php }
else if( $type_value === 'memo' ){
$memo_value = get_sub_field('memo',$order_id);
?>
<div id="customerMessageMemo">
<audio id="wp_mep_1" src="<?php echo $memo_value; ?>" type="audio/mp3" controls="controls" preload="auto" >
<object width="709" height="50" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $memo_value; ?>" />
</object>
</audio>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
,audioWidth:709,audioHeight:50
});
});
</script>
</div>
<?php } else($type_value === 'video' ){
$video_value = get_sub_field('video',$order_id);
?>
<div id="customerMessageVideo">
<video id="wp_mep_1" src="<?php echo $video_value; ?>" type="video/mp4" width="709" height="399" controls="controls" preload="true" >
<object width="709" height="399" type="application/x-shockwave-flash" data="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf">
<param name="movie" value="http://localhost:8888/spiritcard.dk/wp-content/plugins/media-element-html5-video-and-audio-player/mediaelement/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&amp;file=<?php echo $video_value; ?>" />
</object>
</video>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#wp_mep_1').mediaelementplayer({
m:1
,features: ['playpause','current','progress','duration','volume','tracks','fullscreen']
});
});
</script>
</div>
<?php } ?>
<?php endwhile; ?>
<?php endif; ?>