Solved

Wordpress JQuery Conflict

Posted on 2014-03-24
1
298 Views
Last Modified: 2014-04-08
I have a JQuey function that when you click a button it shows a hidden div.  I'm using word press.  

I have the Div inside of a function.  When I have the div within the HTML it opens and closes fine.  BUT now with the div inside of a function, it will not open

JQuery Function:
$(document).ready(function() {
$(':button[name^="custom_"]').click(function() {
			$(this).val("Finish Customizing");
			var x = $(this).attr("name").replace(/\D/g,"");
			x = x?"-"+x:"";
			$("#custom-hidden-1").toggle('slow');
	});});

Open in new window



PHP Function:
function checkout_fields() {

?>
<div id="custom-color-1">
<p id="company-wrap">
<span class="edd-description"><?php _e( 'Enter the name of your company.', 'pippin_edd' ); ?></span>
<input class="edd-input" type="text" name="edd_company" id="edd-company" placeholder="<?php _e('Company Name', 'pippin_edd'); ?>" value=""/>
</p>
</div>
<?php					
}

Open in new window

0
Comment
Question by:rgranlund
1 Comment
 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
ID: 39951865
WP uses jQuery to reference the library so you have to use jQuery and not $ - but you can pass the jQuery object into the function as $ by changing your code like so...

jQuery(document).ready(function($) {
$(':button[name^="custom_"]').click(function() {
			$(this).val("Finish Customizing");
			var x = $(this).attr("name").replace(/\D/g,"");
			x = x?"-"+x:"";
			$("#custom-hidden-1").toggle('slow');
	});});

Open in new window

0

Featured Post

Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…
PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
The purpose of this video is to demonstrate how to reset a WordPress password if you are locked out and cannot reset the password. A typical use would be if you cannot access the email to which WordPress would send the password recovery email to…
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question