I have a number of contact forms that open in modal windows, there is a p tag with an id of "description" I need to copy that text into the textarea when the modal is opened.
Link to example: http://vertufineart.com/artists/chiho-aoshima/ - click any of the artworks along top of page or those beneath, a modal window with a HubSpot contact form will open up.
Jeremy answers:
You have several <p> tags with the same id attribute which will cause problems.
Is that code the result of a plugin or hand-coded?
Jeremy comments:
Provided you have jQuery Library loaded in the header you can use the following
<?php
add_action("wp_footer", "modal_description");
function modal_description() {
?>
<script>
jQuery(".inner").on("click", function() {
var desc = jQuery(this).find("p").text();
jQuery('textarea[name="your_message"]').text(desc);});
</script>
<?php
{
Jeremy comments:
Last curly brace should "}" instead of "{"
Mike Sewell comments:
Hi Jeremy,
This almost works perfectly, if I click on any of the artworks in the main page content the description is filled in correctly, but if I click any of the artworks on the top scrollbar the correct description doesn't show.
Here is my code for the page single-artists.php and the two files it calls, owl-carousel.php and modal.php.
<?php
/*
Template Name: Artist Single
*/
global $post;
$slug = get_post( $post )->post_name;
$title = get_post( $post )->post_title;
get_header(); ?>
<div class="container">
<?php // start the loop
while ( have_posts() ) : the_post(); ?>
<?php include_once('parts/owl-carousel.php'); ?>
<?php include_once('parts/modal.php'); ?>
<?php /* primary */ ?>
<div class="primary">
<div class="page-content">
<h2 class="page-title"><?php the_title(); ?> Artwork for Sale</h2>
<?php if($post->post_content=="") : ?>
<?php else : ?>
<div class="excerpt">
<?php if ( get_field('custom_excerpt')) { ?>
<?php the_field('custom_excerpt'); ?>
<a href="#content" class="jump">Read More</a>
<?php } else { ?>
<?php the_excerpt(); ?>
<a href="#content" class="jump">Read More</a>
<?php } ?>
</div><!-- .excerpt -->
<?php endif; ?>
</div>
<div class="column-wrap">
<div id="container" class="js-masonry" data-masonry-options='{ "itemSelector": ".item" }'>
<?php
$num = 1;
if(get_field('artist_gallery')): ?>
<?php while(the_repeater_field('artist_gallery')): ?>
<div class="block item">
<a href="#" data-reveal-id="art-<?php echo $num++; ?>">
<div class="inner">
<?php
$attachment_id = get_sub_field('image');
$size = "full"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
?>
<img src="<?php echo $image[0]; ?>" alt="<?php the_title(); ?>" />
<?php /*
<img src="<?php the_sub_field('image'); ?>" alt="<?php the_sub_field('alt'); ?>" />
*/ ?>
<div class="block-content">
<h4><?php the_title(); ?></h4>
<p><?php the_sub_field('description'); ?></p>
</div>
</div>
</a>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div><!-- #container -->
<div id="content"><!-- target for read more link --></div>
</div><!-- .column-wrap -->
</div><!-- .primary -->
<?php endwhile; // end of the loop. ?>
<?php
// hide unless theres's something in the_content
if($post->post_content=="") : ?>
<?php else : ?>
<?php /* secondary */ ?>
<div class="secondary">
<div class="block one">
<h2><?php the_title(); ?></h2>
<?php the_content(); ?>
</div>
<div class="block two">
<?php the_field('content_right'); ?>
</div><!-- .block .two -->
</div><!-- .secondary -->
<?php endif; ?>
<?php /* tertiary */ ?>
<div class="tertiary">
<?php /* Related News Content */ ?>
<div class="block related">
<?php
if( get_field('show_related_posts') ) { ?>
<?php $tag = get_field('tag'); ?>
<h2>News</h2>
<?php
$args=array(
'post_type' => 'post',
'orderby' => 'date',
'order' => 'DESC',
'showposts' => 5,
'tag' => $tag,
);
$my_query = null;
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post();
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="thumbnail">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail(); ?>
</a>
</div>
<div class="content">
<header class="entry-header group">
<h3 class="entry-title">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'sonicpixel' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_title(); ?></a>
</h3>
<div class="meta">
<p><?php sonicpixel_entry_meta(); ?></p>
</div>
</header><!-- .entry-header -->
<div class="entry-content">
<?php the_excerpt(); ?>
</div>
</div><!-- .content -->
</article>
<?php
endwhile;
}
wp_reset_query(); // Restore global post data stomped by the_post().
?>
</div><!-- .block -->
<?php } ?>
<?php /* Ebook Call Out */ ?>
<div class="block cta">
<?php include('parts/call-out.php'); ?>
</div>
</div><!-- .tertiary -->
</div><!-- .page-content -->
<?php get_footer(); ?>
<script src="<?php bloginfo('template_url'); ?>/js/sticky-kit.js" type="text/javascript"></script>
<script>
jQuery(window).on('load', function(){ var $ = jQuery;
// load sticky kit on wider screens only
var pageWidth = $(window).width();
if (pageWidth > 1024) {
//jQuery( document ).ready( function( $ ) {
$(".block.one").stick_in_parent({
container: $(".secondary")
})
}
});
</script>
and for owl-carousel.php (the sliding images at the top) and modal.php
<strong>owl-carousel.php</strong>
<?php /* using artist gallery */
$num = 1;
?>
<div id="owl-art" class="owl-carousel owl-theme">
<?php if(get_field('artist_gallery')): ?>
<?php while(the_repeater_field('artist_gallery')): ?>
<?php
$attachment_id = get_sub_field('image');
$size = "owl"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
?>
<?php $image = wp_get_attachment_image_src(get_sub_field('image'), 'owl'); ?>
<div class="item">
<a href="#" data-reveal-id="art-<?php echo $num++; ?>">
<img src="<?php echo $image[0]; ?>" alt="<?php the_title(); ?>" />
</a>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div><!-- #owl-art -->
modal.php
<?php /* === modals === */ ?>
<?php /* original way
$args=array(
'post_type' => 'artwork',
'showposts' => -1,
'tax_query' => array(
array('taxonomy' => 'artist',
'terms' => $slug,
'field' => 'slug',
)
),
'orderby' => 'title',
'order' => 'ASC',
);
$my_query = null;
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post();
<?php /*
endwhile;
}
wp_reset_query(); // Restore global post data stomped by the_post().
<div id="modal-<?php the_ID(); ?>" class="reveal-modal xlarge" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
<div class="row" id="printableArea">
<div class="small-12 medium-8 columns">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } ?>
</div>
<div class="small-12 medium-4 columns">
<h3><?php echo get_the_term_list( get_the_ID(), 'artist' ); ?></h3>
<p><?php the_title() ;?><br/>
<?php echo get_the_content(); ?></p>
<h4>Contact For Price:</h4>
<p>Vertu Fine Art | 561.368.4680</p>
<?php echo do_shortcode('[contact-form-7 id="2735" title="Artwork Contact"]'); ?>
<div class="addthis_sharing_toolbox"></div>
</div>
<a class="close-reveal-modal" aria-label="Close"><img src="<?php bloginfo('template_url'); ?>/images/icon-close-modal.gif" alt="" /></a>
</div><!-- .row -->
</div><!-- .reveal-modal -->
*/
?>
<?php
$num = 1;
if(get_field('artist_gallery')): ?>
<?php while(the_repeater_field('artist_gallery')): ?>
<div id="art-<?php echo $num++; ?>" class="reveal-modal xlarge modal-window" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
<div class="row" id="printableArea">
<div class="art-image small-12 medium-8 columns">
<?php
$attachment_id = get_sub_field('image');
$size = "full"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
$description = get_sub_field('description');
?>
<img src="<?php echo $image[0]; ?>" alt="<?php the_title(); ?>" />
</div>
<div class="small-12 medium-4 columns">
<h3><?php the_title() ;?></h3>
<p id="description"><?php the_sub_field('description'); ?></p>
<h4>Contact For Price:</h4>
<p>Vertu Fine Art | 561.368.4680</p>
<?php //echo do_shortcode('[contact-form-7 id="2808" title="Artwork Contact"]'); ?>
<?php // echo do_shortcode('[contact-form-7 id="5671" title="Contact form 1"]'); ?>
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: '244097',
formId: '9f147816-3459-4218-ba18-2d9119b6c0c4'
});
</script>
<div class="addthis_sharing_toolbox"></div>
</div>
<a class="close-reveal-modal" aria-label="Close"><img src="<?php bloginfo('template_url'); ?>/images/icon-close-modal.gif" alt="close-modal" /></a>
</div><!-- .row -->
</div><!-- .reveal-modal -->
<?php endwhile; ?>
<?php endif; ?>
<?php /* === end modals === */ ?>
Mike Sewell comments:
Hi Jeremy,
This almost works perfectly, if I click on any of the artworks in the main page content the description is filled in correctly, but if I click any of the artworks on the top scrollbar the correct description doesn't show.
Here is my code for the page single-artists.php and the two files it calls, owl-carousel.php and modal.php.
<?php
/*
Template Name: Artist Single
*/
global $post;
$slug = get_post( $post )->post_name;
$title = get_post( $post )->post_title;
get_header(); ?>
<div class="container">
<?php // start the loop
while ( have_posts() ) : the_post(); ?>
<?php include_once('parts/owl-carousel.php'); ?>
<?php include_once('parts/modal.php'); ?>
<?php /* primary */ ?>
<div class="primary">
<div class="page-content">
<h2 class="page-title"><?php the_title(); ?> Artwork for Sale</h2>
<?php if($post->post_content=="") : ?>
<?php else : ?>
<div class="excerpt">
<?php if ( get_field('custom_excerpt')) { ?>
<?php the_field('custom_excerpt'); ?>
<a href="#content" class="jump">Read More</a>
<?php } else { ?>
<?php the_excerpt(); ?>
<a href="#content" class="jump">Read More</a>
<?php } ?>
</div><!-- .excerpt -->
<?php endif; ?>
</div>
<div class="column-wrap">
<div id="container" class="js-masonry" data-masonry-options='{ "itemSelector": ".item" }'>
<?php
$num = 1;
if(get_field('artist_gallery')): ?>
<?php while(the_repeater_field('artist_gallery')): ?>
<div class="block item">
<a href="#" data-reveal-id="art-<?php echo $num++; ?>">
<div class="inner">
<?php
$attachment_id = get_sub_field('image');
$size = "full"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
?>
<img src="<?php echo $image[0]; ?>" alt="<?php the_title(); ?>" />
<?php /*
<img src="<?php the_sub_field('image'); ?>" alt="<?php the_sub_field('alt'); ?>" />
*/ ?>
<div class="block-content">
<h4><?php the_title(); ?></h4>
<p><?php the_sub_field('description'); ?></p>
</div>
</div>
</a>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div><!-- #container -->
<div id="content"><!-- target for read more link --></div>
</div><!-- .column-wrap -->
</div><!-- .primary -->
<?php endwhile; // end of the loop. ?>
<?php
// hide unless theres's something in the_content
if($post->post_content=="") : ?>
<?php else : ?>
<?php /* secondary */ ?>
<div class="secondary">
<div class="block one">
<h2><?php the_title(); ?></h2>
<?php the_content(); ?>
</div>
<div class="block two">
<?php the_field('content_right'); ?>
</div><!-- .block .two -->
</div><!-- .secondary -->
<?php endif; ?>
<?php /* tertiary */ ?>
<div class="tertiary">
<?php /* Related News Content */ ?>
<div class="block related">
<?php
if( get_field('show_related_posts') ) { ?>
<?php $tag = get_field('tag'); ?>
<h2>News</h2>
<?php
$args=array(
'post_type' => 'post',
'orderby' => 'date',
'order' => 'DESC',
'showposts' => 5,
'tag' => $tag,
);
$my_query = null;
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post();
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="thumbnail">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail(); ?>
</a>
</div>
<div class="content">
<header class="entry-header group">
<h3 class="entry-title">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'sonicpixel' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_title(); ?></a>
</h3>
<div class="meta">
<p><?php sonicpixel_entry_meta(); ?></p>
</div>
</header><!-- .entry-header -->
<div class="entry-content">
<?php the_excerpt(); ?>
</div>
</div><!-- .content -->
</article>
<?php
endwhile;
}
wp_reset_query(); // Restore global post data stomped by the_post().
?>
</div><!-- .block -->
<?php } ?>
<?php /* Ebook Call Out */ ?>
<div class="block cta">
<?php include('parts/call-out.php'); ?>
</div>
</div><!-- .tertiary -->
</div><!-- .page-content -->
<?php get_footer(); ?>
<script src="<?php bloginfo('template_url'); ?>/js/sticky-kit.js" type="text/javascript"></script>
<script>
jQuery(window).on('load', function(){ var $ = jQuery;
// load sticky kit on wider screens only
var pageWidth = $(window).width();
if (pageWidth > 1024) {
//jQuery( document ).ready( function( $ ) {
$(".block.one").stick_in_parent({
container: $(".secondary")
})
}
});
</script>
and for owl-carousel.php (the sliding images at the top) and modal.php
<strong>owl-carousel.php</strong>
<?php /* using artist gallery */
$num = 1;
?>
<div id="owl-art" class="owl-carousel owl-theme">
<?php if(get_field('artist_gallery')): ?>
<?php while(the_repeater_field('artist_gallery')): ?>
<?php
$attachment_id = get_sub_field('image');
$size = "owl"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
?>
<?php $image = wp_get_attachment_image_src(get_sub_field('image'), 'owl'); ?>
<div class="item">
<a href="#" data-reveal-id="art-<?php echo $num++; ?>">
<img src="<?php echo $image[0]; ?>" alt="<?php the_title(); ?>" />
</a>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div><!-- #owl-art -->
modal.php
<?php /* === modals === */ ?>
<?php /* original way
$args=array(
'post_type' => 'artwork',
'showposts' => -1,
'tax_query' => array(
array('taxonomy' => 'artist',
'terms' => $slug,
'field' => 'slug',
)
),
'orderby' => 'title',
'order' => 'ASC',
);
$my_query = null;
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post();
<?php /*
endwhile;
}
wp_reset_query(); // Restore global post data stomped by the_post().
<div id="modal-<?php the_ID(); ?>" class="reveal-modal xlarge" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
<div class="row" id="printableArea">
<div class="small-12 medium-8 columns">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } ?>
</div>
<div class="small-12 medium-4 columns">
<h3><?php echo get_the_term_list( get_the_ID(), 'artist' ); ?></h3>
<p><?php the_title() ;?><br/>
<?php echo get_the_content(); ?></p>
<h4>Contact For Price:</h4>
<p>Vertu Fine Art | 561.368.4680</p>
<?php echo do_shortcode('[contact-form-7 id="2735" title="Artwork Contact"]'); ?>
<div class="addthis_sharing_toolbox"></div>
</div>
<a class="close-reveal-modal" aria-label="Close"><img src="<?php bloginfo('template_url'); ?>/images/icon-close-modal.gif" alt="" /></a>
</div><!-- .row -->
</div><!-- .reveal-modal -->
*/
?>
<?php
$num = 1;
if(get_field('artist_gallery')): ?>
<?php while(the_repeater_field('artist_gallery')): ?>
<div id="art-<?php echo $num++; ?>" class="reveal-modal xlarge modal-window" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
<div class="row" id="printableArea">
<div class="art-image small-12 medium-8 columns">
<?php
$attachment_id = get_sub_field('image');
$size = "full"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
$description = get_sub_field('description');
?>
<img src="<?php echo $image[0]; ?>" alt="<?php the_title(); ?>" />
</div>
<div class="small-12 medium-4 columns">
<h3><?php the_title() ;?></h3>
<p id="description"><?php the_sub_field('description'); ?></p>
<h4>Contact For Price:</h4>
<p>Vertu Fine Art | 561.368.4680</p>
<?php //echo do_shortcode('[contact-form-7 id="2808" title="Artwork Contact"]'); ?>
<?php // echo do_shortcode('[contact-form-7 id="5671" title="Contact form 1"]'); ?>
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: '244097',
formId: '9f147816-3459-4218-ba18-2d9119b6c0c4'
});
</script>
<div class="addthis_sharing_toolbox"></div>
</div>
<a class="close-reveal-modal" aria-label="Close"><img src="<?php bloginfo('template_url'); ?>/images/icon-close-modal.gif" alt="close-modal" /></a>
</div><!-- .row -->
</div><!-- .reveal-modal -->
<?php endwhile; ?>
<?php endif; ?>
<?php /* === end modals === */ ?>
Jeremy comments:
Ah, I overlooked the Carousel
Revised:
<?php
add_action("wp_footer", "modal_description");
function modal_description() {
?>
<script>
jQuery(".inner").on("click", function() {
var desc = jQuery(this).find("p").text();
jQuery('textarea[name="your_message"]').text(desc);});
jQuery(".owl-item").on("click", function() {
var art = jQuery(this).find("a").attr("data-reveal-id");
var artParent = jQuery("a[data-reveal-id='"+ art +"']");
var desc = artParent.find("p").text();
jQuery('textarea[name="your_message"]').text(desc);
});
</script>
<?php
}
Mike Sewell comments:
Hmm, it works perfect on the lower images, but for the carousel it's either not loading the description data or else keeping the data from the previously clicked modals.
Mike Sewell comments:
You can see your code on the site here: http://vertufineart.com/artists/mel-ramos/
Jeremy comments:
That Page only contains the original solution. Have you updated and cleared any server side caching plugins?
Jeremy comments:
Replace the code you previously added to your functions.php file with the following
<?php
add_action("wp_footer", "modal_description");
function modal_description() {
?>
<script>
jQuery(document).ready(function () {
jQuery(".inner").on("click", function() {
jQuery('textarea[name="your_message"]').text();
var desc = jQuery(this).find("p").text();
jQuery('textarea[name="your_message"]').text(desc);});
jQuery(".owl-item").on("click", function() {
jQuery('textarea[name="your_message"]').text();
var art = jQuery(this).find("a").attr("data-reveal-id");
var artParent = jQuery("a[data-reveal-id='"+ art +"']");
var desc = artParent.find("p").text();
jQuery('textarea[name="your_message"]').text(desc);
});
});
</script>
<?php
}
Tested and working on the page you sent over
Mike Sewell comments:
Really appreciate your help, but the description isn't getting copied to the textarea on the carousel section for me.
http://cl.ly/image/0v2Y3Q1c002U
Jeremy comments:
I am not quite sure why it isn't translating into a workable solution when you add it to your site. I suppose it could depend on how the code is being implemented but I expected that you would add it to the functions.php for your active theme.
It works fine when I run it in the Console in Google Chrome on your site.
Mike Sewell comments:
Hi Jeremy, sorry for the delay, I'm accepting your answer.
Luis Abarca answers:
Can you add the code to open the modal window ?
Mike Sewell comments:
Sure, it's using Foundation 5's [[LINK href="http://foundation.zurb.com/docs/components/reveal.html"]]Reveal Modal[[/LINK]]
Luis Abarca comments:
Add this in your footer.php
<script>
(function($)
{
$(document).ready(function()
{
var current_modal_id = '';
$('#container .item a').each(function()
{
$(this).click(function()
{
current_modal_id = '#' + $(this).data('reveal-id');
});
});
$(document).on('opened.fndtn.reveal', '#art-2[data-reveal]', function ()
{
$('.hbspt-form textarea', $(current_modal_id)).val( $('#description', $(current_modal_id)).html() );
});
});
})(jQuery);
</script>
Luis Abarca comments:
Add this in your footer.php
(function($)
{
$(document).ready(function()
{
var current_modal_id = '';
$('#container .item a').each(function()
{
$(this).click(function()
{
// Get the current modal ID
current_modal_id = '#' + $(this).data('reveal-id');
});
});
$(document).on('opened.fndtn.reveal', '#art-2[data-reveal]', function ()
{
// Add the description content to textarea
$('.hbspt-form textarea', $(current_modal_id)).val( $('#description', $(current_modal_id)).html() );
});
});
})(jQuery);
Luis Abarca comments:
Sorry, this is the correct.
(function($)
{
$(document).ready(function()
{
var current_modal_id = '';
$('#container .item a').each(function()
{
$(this).click(function()
{
// Get the current modal ID
current_modal_id = '#' + $(this).data('reveal-id');
});
});
$(document).on('opened.fndtn.reveal', '[data-reveal]', function ()
{
// Add the description content to textarea
$('.hbspt-form textarea', $(current_modal_id)).val( $('#description', $(current_modal_id)).html() );
});
});
})(jQuery);
Luis Abarca comments:
Fix for carousel links:
(function($)
{
$(document).ready(function()
{
var current_modal_id = '';
$('#container .item a, .owl-item a').each(function()
{
$(this).click(function()
{
current_modal_id = '#' + $(this).data('reveal-id');
});
});
$(document).on('opened.fndtn.reveal', '[data-reveal]', function ()
{
$('.hbspt-form textarea', $(current_modal_id)).val( $('#description', $(current_modal_id)).html() );
});
});
})(jQuery);
Mike Sewell comments:
Tahnks, this works except for the carousel, even with the fix for carousel code.
Luis Abarca comments:
Try this one:
(function($)
{
$(document).ready(function()
{
var current_modal_id = '';
$('.item a').each(function()
{
$(this).click(function()
{
current_modal_id = '#' + $(this).data('reveal-id');
});
});
$(document).on('opened.fndtn.reveal', '[data-reveal]', function ()
{
$('.hbspt-form textarea', $(current_modal_id)).val( $('#description', $(current_modal_id)).html() );
});
});
})(jQuery);
Romel Apuya answers:
try this in function.php
<?php
add_action('wp_head','set_to_hidden');
function set_to_hidden(){
?>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type='text/javascript'>
/* <![CDATA[ */
jQuery.noConflict();
jQuery( document ).ready(function( $ ) {
$('.reveal-modal').each(function() {
var hidden_value = $(this).find('.small-12.medium-4.columns').find('p:first').html();
var regex = /<br\s*[\/]?>/gi;
hidden_value.html(str.replace(regex, "\n"));
$(this).find('.hbspt-form').find('textarea').val(hidden_value);
});
});
/* ]]> */
</script>
<?php
}
?>