I am getting following error on the browser console when I am on checkout page.
ReferenceError: payment is not defined
When I click on the credit card payment option no Form is opened to enter card details and above mentioned error is thrown.
For the Credit card authorize.net option in Magento admin is being used.I am also using the paypal express checkout
I have following code in the template\checkout\onepage\payment\methods.phtml file
<dl class="sp-methods" id="checkout-payment-method-load">
<?php
$methods = $this->getMethods();
$oneMethod = count($methods) <= 1;
?>
<?php echo $this->getfieldshtml(1); ?>
<?php
foreach ($methods as $_method):
$_code = $_method->getCode();
?>
<dt>
<?php if(!$oneMethod): ?>
<input id="p_method_<?php echo $_code ?>" value="<?php echo $_code ?>" type="radio" name="payment[method]" title="<?php echo $this->htmlEscape($_method->getTitle()) ?>" onclick="payment.switchMethod('<?php echo $_code ?>')"<?php if($this->getSelectedMethodCode()==$_code): ?> checked="checked"<?php endif; ?> class="radio" />
<?php else: ?>
<span class="no-display"><input id="p_method_<?php echo $_code ?>" value="<?php echo $_code ?>" type="radio" name="payment[method]" checked="checked" class="radio" /></span>
<?php $oneMethod = $_code; ?>
<?php endif; ?>
<label for="p_method_<?php echo $_code ?>"><?php echo $this->getMethodTitle($_method) ?> <?php echo $this->getMethodLabelAfterHtml($_method) ?></label>
</dt>
<?php if ($html = $this->getPaymentMethodFormHtml($_method)): ?>
<dd>
<?php echo $html; ?>
</dd>
<?php endif; ?>
<?php endforeach; ?>
<?php echo $this->getfieldshtml(2); ?>
<?php echo $this->getfieldshtml(3); ?>
</dl>
<?php echo $this->getChildChildHtml('additional'); ?>
<script type="text/javascript">
//<![CDATA[
//function obsrv(id){
// if(id && id!=null){
// $$("#"+id+" input,#"+id+" label,#"+id+" select").each(function(onebyone){if($(onebyone.id) && $(onebyone.id)!=null){$(onebyone.id).removeAttribute("disabled");}});
// }
// }
<?php echo $this->getChildChildHtml('scripts'); ?>
$$("#co-payment-form input,#co-payment-form select").each(function(onebyone){if($(onebyone.id) && $(onebyone.id)!=null && onebyone.name.startsWith('fm_fields')){if(true){$(onebyone.id).removeAttribute("disabled");}}});
<?php if (is_string($oneMethod)): ?>
payment.switchMethod('<?php echo $oneMethod ?>');
<?php endif; ?>
//]]>
</script>
I replaced the code with following because this is there in Magento default code file also
<script type="text/javascript">
//<![CDATA[
<?php echo $this->getChildChildHtml('scripts'); ?>
payment.init();
<?php if (is_string($oneMethod)): ?>
payment.switchMethod('<?php echo $oneMethod ?>');
<?php endif; ?>
//]]>
</script>
But still no luck
replace all payment. by billing. in that file and in osc_payment.js and payment.js of ogone + add this configurable layout :
<checkout_onestep_index>
<reference name="head">
<action method="addJs"><script>netresearch/ops/osc_payment.js</script></action>
<action method="addJs"><script>netresearch/ops/payment.js</script></action>
</reference>
<reference name="head">
<action method="addCss"><stylesheet>css/ops.css</stylesheet></action>
</reference>
</checkout_onestep_index>
I had the same error, maybe for another reason, maybe not, so this is how I've solved it...
We have PHP set to use commas for type "float". But payment.phtml is echoing this :
var quoteBaseGrandTotal = <?php echo (float)$this->getQuoteBaseGrandTotal(); ?>;
When orders amount is a float as 19,83€ , result is :
var quoteBaseGrandTotal = 19,83;
This produced the javascript error.
I had not enough time to patch this properly, so I replace the line with :
var quoteBaseGrandTotal = <?php echo str_replace(',','.', (float)$this->getQuoteBaseGrandTotal() ); ?>;
And the problem disappeared.
Related
I am working with wordpress and jquery tabs and was wondering if somebody can help me. My example is similar to this one jQuery UI Tabs
Here is my php code
<?php if (!defined('FW')) die( 'Forbidden' ); ?>
<?php $tabs_id = uniqid('fw-image-tabs-'); ?>
<div class="fw-image-tabs-container" id="<?php echo esc_attr($tabs_id); ?>">
<div class="fw-image-tabs">
<?php foreach ($atts['image_tabs'] as $key => $tab) : ?>
<div class="fw-image-tabs-content" id="<?php echo esc_attr($tabs_id . '-' . ($key + 1)); ?>">
<h3 class="fw-image-tabs-content"><?php echo $tab['tab_image_title']; ?></h3>
<img src="<?php echo esc_attr( $tab['tab_image']['url']); ?>">
</div>
<?php endforeach; ?>
<ul>
<?php foreach ($atts['image_tabs'] as $key => $tab) : ?>
<li><?php echo $tab['tab_title']; ?></li>
<?php endforeach; ?>
</ul>
<?php foreach ( $atts['image_tabs'] as $key => $tab ) : ?>
<div class="fw-image-tabs-content" id="<?php echo esc_attr($tabs_id . '-' . ($key + 1)); ?>">
<p><?php echo do_shortcode( $tab['tab_content'] ) ?></p>
</div>
<?php endforeach; ?>
</div>
</div>
And my script
jQuery(document).ready(function ($) {
$('.fw-image-tabs-container').tabs();
});
The trouble i am having is that i cannot hide the second <div class="fw-image-tabs-content"></div>. Both divs have the same class name and the same id. For some reason only the first id works. How can i show/hide the text for both divs?
Thanks
Have you tried this?
jQuery(document).ready(function ($) {
$('.fw-image-tabs').tabs();
});
I'm trying to make the product filter for a magento shop collapsible. I tried editing the view.phtml in template/category/layer/view.phtml But it's not working.
I Edited these lines: <dt><?php echo $this->__($_filter->getName()) ?></dt>
to <dt><?php echo $this->__($_filter->getName()) ?></dt>
and i added some jquery like this:
<script type="text/javascript">
/* <![CDATA[ */
jQuery(document).ready(function(){
jQuery("dl#narrow-by-list> dd:not(:first)").hide();
jQuery("dl#narrow-by-list> dt a").click(function(){
jQuery("dl#narrow-by-list> dd:visible").slideUp("fast");
jQuery(this).parent().next().slideDown("fast");
return false;
});
});
/* ]]> */
</script>
Current code:
?>
<?php if($this->canShowBlock()): ?>
<div class="block block-layered-nav">
<div class="block-title">
<strong><span><?php echo $this->__('Shop By') ?></span></strong>
</div>
<div class="block-content">
<?php echo $this->getStateHtml() ?>
<?php if ($this->getLayer()->getState()->getFilters()): ?>
<div class="actions"><?php echo $this->__('Clear All') ?></div>
<?php endif; ?>
<?php if($this->canShowOptions()): ?>
<p class="block-subtitle"><?php echo $this->__('Shopping Options') ?></p>
<dl id="narrow-by-list">
<?php $_filters = $this->getFilters() ?>
<?php foreach ($_filters as $_filter): ?>
<?php if($_filter->getItemsCount()): ?>
<div class="<?php if(strcasecmp($_filter->getName(), 'PRICE') == 0) echo 'layered-price'; else echo 'layered-attribute'; ?>">
<div class="title-layered"><dt><?php echo $this->__($_filter->getName()) ?></dt></div>
<dd><?php echo $_filter->getHtml() ?></dd>
</div>
<?php endif; ?>
<?php endforeach; ?>
</dl>
<script type="text/javascript">decorateDataList('narrow-by-list')</script>
<?php endif; ?>
</div>
</div>
<?php endif; ?>
<script type="text/javascript">
/* <![CDATA[ */
jQuery(document).ready(function(){
jQuery("#narrow-by-list> dd:not(:first)").hide();
jQuery("#narrow-by-list> dt a").click(function(){
jQuery("#narrow-by-list> dd:visible").slideUp("fast");
jQuery(this).parent().next().slideDown("fast");
return false;
});
});
/* ]]> */
</script>
Anyone any idea why this is not working?
You made a click event on a link tag
You can trick your javascript with this href attribute:
<dt> <?php echo $this->__($_filter->getName()) ?></dt>
and then your jquery click function will be triggered as usual.
This is my wp loop:
<?php get_header(); ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
<div style="background:url(<?php echo $url; ?>);">
<button id="change">preview</button>
</div>
<?php endwhile; ?>
<?php else : ?>
<?php endif; ?>
<?php get_footer(); ?>
After clicking on button "change" it should change my body background to $url for e.g.
<body style="background:url($url);
where $url is thumbnail url
Any ideas how to make it?
Greetings
EDIT: I noticed you are using id="change". Id is unique and if your loop makes more than one button with the same Id, it won't work. make class="change". I've edited the rest for you.
here is a jsfiddle. http://jsfiddle.net/Grimbode/2bt8Q/1/
You should essentially load your url's as the value of a hidden input, like so:
<body>
<div>
<button class="change">preview<input type="hidden" value="http://pngimg.com/upload/tree_PNG2517.png"/></button>
</div>
</body>
Then using jQuery:
$('.change').on('click', function(){
$(document.body).css('background', 'url('+$(this).find('input').val()+')');
});
When the button is clicked, it will change your document.body's background to whatever the URL is.
Thus your php file should look like this:
<?php get_header(); ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
<div>
<button class="change">preview<input type="hidden" value="<?php echo $url; ?>"/></button>
</div>
<?php endwhile; ?>
<?php else : ?>
<?php endif; ?>
<?php get_footer(); ?>
Hope this helps, cheers.
Ok, if this question has already been answered, I apologize, I have searched and not found a satisfactory answer that fits my situation.
Here is the situation:
I have a custom template file for displaying the products in a category, part of that list is the ability to add products directly to the cart with a specified quantity from the category page. In order to accomplish this I wrote a function that re-writes the target line of the "Add to Cart" button, submits the request, then re-writes the button again back to it's original version (see code below). The problem I'm running into is that every time the button is clicked right now I get an error in the debug panel stating that customAddToCart is not defined. But if you look at the code for the product list template below you can see that the function is defined even before the list is generated (btw, I had it at the bottom of the page and was getting the same error).
If anyone can shed some light on why the javascript function would be undefined when it's being included on the same page as the list...I could sure use some help.
<?php
/**
* Product list template
*
* #see Mage_Catalog_Block_Product_List
*/
?>
<?php
$_productCollection=$this->getLoadedProductCollection();
$_helper = $this->helper('catalog/output');
?>
<script type="text/javascript">
function customAddToCart( product_id, url ){
var qty = document.getElementById('qty_input_'+product_id).value;
document.getElementById('addtocartbutton_'+product_id).setAttribute('onclick', "setLocation(" + url + "/qty/" + qty ")");
document.getElementById('addtocartbutton_'+product_id).click(); return false;
document.getElementById('addtocartbutton_'+product_id).setAttribute('onclick', "customAddToCart(" + product_id + ", " + url + ")");
}
</script>
<?php if(!$_productCollection->count()): ?>
<p class="note-msg"><?php echo $this->__('There are no products matching the selection.') ?></p>
<?php else: ?>
<div class="category-products">
<?php // List mode ?>
<?php if($this->getMode()!='grid'): ?>
<ol class="products-list" id="products-list">
<?php foreach ($_productCollection as $_product): ?>
<li class="item">
<?php // Product Image ?>
<img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(TRUE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(230, null); ?>" width="230" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" />
<?php // Product description ?>
<div class="product-shop">
<div class="f-fix">
<?php $_productNameStripped = $this->stripTags($_product->getName(), null, true); ?>
<h2 class="product-name"><?php echo $_helper->productAttribute($_product, $_product->getName() , 'name'); ?></h2>
<?php if($_product->getRatingSummary()): ?>
<?php echo $this->getReviewsSummaryHtml($_product) ?>
<?php endif; ?>
<?php echo $this->getPriceHtml($_product, true) ?>
<div class="desc std">
<?php echo $_helper->productAttribute($_product, $_product->getShortDescription(), 'short_description') ?>
<?php echo $this->__('Learn More') ?>
</div>
<ul class="add-to-links">
<?php if ($this->helper('wishlist')->isAllow()) : ?>
<li><?php echo $this->__('Add to Wishlist') ?></li>
<?php endif; ?>
<?php if($_compareUrl=$this->getAddToCompareUrl($_product)): ?>
<li><span class="separator">|</span> <?php echo $this->__('Add to Compare') ?></li>
<?php endif; ?>
</ul>
<div class="add-to-cart-options">
<?php if($_product->isSaleable()): ?>
<?php if( !($_product->getTypeInstance(true)->hasRequiredOptions($_product) || $_product->isGrouped() )){ ?>
<label for="qty_input">Quantity: </label>
<input type="text" class="spinner qty-input" name="qty_input" id="qty_input_<?php echo $_product->getId(); ?>" />
<?php /*<p><button type="button" title="<?php echo $this->__('Add to Cart') ?>" class="button btn-cart" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')"><span><span><?php echo $this->__('Add to Cart') ?></span></span></button></p> */ ?>
<button type="button" class="button" onclick="javascript:customAddToCart(<?php echo $_product->getId(); ?>, '<?php echo $this->getAddToCartUrl($_product); ?>')"><span><span><?php echo $this->__('Add to Cart'); ?></span></span></button>
<?php } else { ?>
<button type="button" class="button" id="addtocartbutton_<?php echo $_product->getId(); ?>" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')"><span><span><?php echo $this->__('Add to Cart'); ?></span></span></button>
<?php } ?>
<?php else: ?>
<p class="availability out-of-stock"><span><?php echo $this->__('Out of stock') ?></span></p>
<?php endif; ?>
</div>
</div>
</div>
</li>
<?php endforeach; ?>
</ol>
<script type="text/javascript">decorateList('products-list', 'none-recursive')</script>
<?php else: ?>
As you can see, the function is clearly defined at the top of the page, so why this button
<button type="button" class="button" onclick="javascript:customAddToCart(<?php echo $_product->getId(); ?>, '<?php echo $this->getAddToCartUrl($_product); ?>')"><span><span><?php echo $this->__('Add to Cart'); ?></span></span></button>
results in a message in the console saying that customAddToCart is not defined I'm not sure.
Is there an error about an "Unexpected string"? The concatenation in the second line of your function is missing its last plus sign.
Update
"/qty/" + qty ")"
to
"/qty/" + qty + ")"
and refresh.
I would like to display multiple slideshow on one page from my website.
I'm using a repeater ACF to enter my images.
I'm not able to know in advance how many slideshows are going to be displayed
when one slideshow is displayed, everything works perfectly, but when 2 are displayed, It doesn't work anymore.
does anyone knows how I can fix it ?
here is a basic code without the repeater and with 2 slideshows :
http://jsfiddle.net/XRpeA/13/
<div id="slideframe">
<img class="image_news" src="http://s1.lemde.fr/image/2007/07/09/534x0/933544_5_aa6d_polynesie-bora-bora_0608bcead896ce3f59fc0e2fb3cc7435.jpg" />
<img class="image_news" src="http://production.slashmedias.com/main_images/images/000/005/357/IMAGE-PENSEE-HD-1_original_original_large.jpg?1372235419" />
<img class="image_news" src="http://images.telerama.fr/medias/2013/03/media_94814/une-image-un-film-l-auberge-de-dracula-1931,M106823.jpg" />
</div>
<br>
<div id="counter">image <span id="current">1</span> / <span id="total"></span></div>
<br><br>
<div id="slideframe">
<img class="image_news" src="http://s1.lemde.fr/image/2007/07/09/534x0/933544_5_aa6d_polynesie-bora-bora_0608bcead896ce3f59fc0e2fb3cc7435.jpg" />
<img class="image_news" src="http://production.slashmedias.com/main_images/images/000/005/357/IMAGE-PENSEE-HD-1_original_original_large.jpg?1372235419" />
<img class="image_news" src="http://images.telerama.fr/medias/2013/03/media_94814/une-image-un-film-l-auberge-de-dracula-1931,M106823.jpg" />
</div>
<br>
<div id="counter">image <span id="current">1</span> / <span id="total"></span></div>
and here is my code with the repeater :
http://jsfiddle.net/XRpeA/14/
<?php if(get_field('images')): ?>
<div id="counter_2"><span id="current">1</span> / <span id="total"></span></div>
<div id="slideframe">
<?php while(has_sub_field('images')): ?>
<?php if(get_sub_field('image') != ''){ ?>
<img class="image_news" src="<?php the_sub_field('image'); ?>"/>
<?php } ?>
<?php endwhile; ?>
</div>
<?php endif; ?>
thanks a lot
Ok, so I did it just for you as I promiced, thought I thought it will be faster :)
Result
http://skyloveagency.com/new/
(will remove tomorrow)
Fields:
photo_repeater - repeater
---photo_slider - repeater
------photo_block - image with URL output
Full script, not optimized but works perfectly
<?php
/**
* Template Name: Profiles2
*/
get_header(); ?>
<?php
// query
$args = array(
'post_type' => 'profiles',
'show' => 1
);
$wp_query = new WP_Query($args);
?>
<?php $random = 0;
if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
<?php if(get_field('photo_repeater')): ?>
<?php while(has_sub_field('photo_repeater')): ?>
<?php $random++; ?>
<div id="slideframe<?php echo $random; ?>">
<?php if(get_sub_field('photo_slider')): ?>
<?php while( has_sub_field('photo_slider') ): ?>
<?php
$img_url = get_sub_field('photo_block');
$image = aq_resize( $img_url, 200, 200, true );
?>
<img class="image_news" src="<?php echo $image; ?>" alt="111" />
<?php endwhile; ?>
<?php endif; ?>
</div>
<br>
<div id="counter<?php echo $random; ?>">image <span id="current<?php echo $random; ?>">1</span> / <span id="total<?php echo $random; ?>"></span></div>
<script>
var count<?php echo $random; ?> = $('#slideframe<?php echo $random; ?> .image_news').length;
$("#total<?php echo $random; ?>").text(count<?php echo $random; ?>);
// set display:none for all members of ".pic" class except the first
$('#slideframe<?php echo $random; ?> .image_news:gt(0)').hide();
// stores all matches for class="pic"
var $slides<?php echo $random; ?> = $('#slideframe<?php echo $random; ?> .image_news');
$slides<?php echo $random; ?>.click(function () {
// stores the currently-visible slide
var $current<?php echo $random; ?> = $(this);
if ($current<?php echo $random; ?>.is($slides<?php echo $random; ?>.last())) {
$("#current<?php echo $random; ?>").text("1");
$current<?php echo $random; ?>.hide();
$slides<?php echo $random; ?>.first().show();
}
// else, hide current slide and show the next one
else {
$("#current<?php echo $random; ?>").text($current<?php echo $random; ?>.next().index()+1);
$current<?php echo $random; ?>.hide().next().show();
}
});
</script>
<br><br>
<?php endwhile; ?>
<?php endif; ?>
<?php endwhile; ?>
<?php get_footer(); ?>