How to detect a product attribute with Javascript? (Magento) - javascript

I have a working solution to a problem where we're replacing all 'Add to Cart' buttons with 'In Store Only' buttons for items that are only available in store. I'm using PHP to detect the attribute and produce HTML that replaces the button.
<?php
//Checks if the "Disable Add to Cart" variable is set to 'Yes':
if(($_product->getAttributeText('No_cart_button')) == "Yes"){
//If set to Yes, tell PHP what to output:
echo "This Product is not available online, please call our representative if you wish to purchase this.";
}
//If set as No, then show the 'add to cart box' as usual.
else {
?>
<?php if (!$this->hasOptions()):?>
<div class="add-to-box">
<?php if($_product->isSaleable()): ?>
<?php echo $this->getChildHtml('addtocart') ?>
<?php if( $this->helper('wishlist')->isAllow() || $_compareUrl=$this->helper('catalog/product_compare')->getAddUrl($_product)): ?>
<span class="or"><?php echo $this->__('OR') ?></span>
<?php endif; ?>
<?php endif; ?>
<?php echo $this->getChildHtml('addto') ?>
</div>
<?php echo $this->getChildHtml('extra_buttons') ?>
<?php elseif (!$_product->isSaleable()): ?>
<div class="add-to-box">
<?php echo $this->getChildHtml('addto') ?>
</div>
<?php endif; ?>
<?php
}
?>
I've been told that Javascript would be a less intrusive way of doing achieving the same result. Am I right in assuming that you would use PHP to insert a class or id into the HTML element and do the rest with Javascript? Detect the id or class --> generate the replacement button?
Thanks!

Related

Hide particular word using css or javascript

I tried the below code to add div id and replace div class from basic text to heading h3 well it worked but it started displaying all the domain names in the table of contents before the heading.
as ......com with the title text
I want to hide anything which displays with .com
<h3 class="producttitle">
<?php if ($merchant = TemplateHelper::getMerhantName($item)): ?>
<div class="cegg-mb10">
<small class="text-muted title-case"><?php echo \esc_html($merchant); ?></small>
</div>
<?php endif; ?>
<?php if ($item['rating']): ?>
<div class="cegg-title-rating">
<?php TemplateHelper::printRating($item, 'small'); ?>
</div>
<?php endif; ?>
<?php echo \esc_html(TemplateHelper::truncate($item['title'], 80)); ?>
</h3>
I want this code but at the same time i want to hide it in the table of contents from so and so domain .com

ok I fixed it! Now the domain names has gone and headings are working perfectly.
<h3 class="producttitle">
<?php if ($title = TemplateHelper::getMerhantName($item)): ?>
<?php endif; ?>
<?php if ($item['rating']): ?>
<div class="cegg-title-rating">
<?php TemplateHelper::printRating($item, ''); ?>
</div>
<?php endif; ?>
<?php echo \esc_html(TemplateHelper::truncate($item['title'], 80)); ?>
</h3>

Enable javascript within multiple if's?

I have a few if conditions in the following PHP.
I can't enable the Javascript section which needs to hide the class when the cart "quantity" is more than the balance.
jimport( 'joomla.user.helper' );
$user = JFactory::getUser();
$groups = $user->get('groups');
if(in_array(15, $groups)) {
$carts= VirtueMartCart::getCart();
foreach($carts->cartProductsData as $cartItem)
{
if($cartItem['virtuemart_product_id'] == $product->virtuemart_product_id){
echo "<br /> ".$cartItem['quantity']." already added to cart";
}
if($cartItem['quantity'] == $max_balance) <?php { ?>
<script type="text/javascript">
$('.addtocart-button').attr('disabled', 'disabled');
</script>
<?php } ?>
} }
I don't know how to close the first php instance. It refuses.

You cannot use <?php ... ?> in side <?php ... ?>, this is incorrect syntax.
Use the following:
<?php
jimport('joomla.user.helper');
$user = JFactory::getUser();
$groups = $user->get('groups');
if (in_array(15, $groups)):
$carts = VirtueMartCart::getCart();
foreach ($carts->cartProductsData as $cartItem):
if ($cartItem['virtuemart_product_id'] == $product->virtuemart_product_id)
{
echo "<br /> " . $cartItem['quantity'] . " already added to cart";
}
if ($cartItem['quantity'] == $max_balance):
?>
<script type="text/javascript">
$('.addtocart-button').attr('disabled', 'disabled');
</script>
<?php
endif;
endforeach;
endif;
This uses Alternative Syntax which is a preferred method when nesting PHP code in HTML blocks.

You have a bit of a mess inside your php code.
I find using the if () : endif; notation is more readable when dealing with php+html
<?php
jimport( 'joomla.user.helper' );
$user = JFactory::getUser();
$groups = $user->get('groups');
?>
<?php if(in_array(15, $groups)): ?>
<?php foreach(VirtueMartCart::getCart()->cartProductsData as $cartItem): ?>
<?php if($cartItem['virtuemart_product_id'] == $product->virtuemart_product_id): ?>
<br /><?php echo $cartItem['quantity']; ?> already added to cart";
<?php endif; ?>
<?php if($cartItem['quantity'] == $max_balance): ?>
<script type="text/javascript">
$('.addtocart-button').attr('disabled', 'disabled');
</script>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>

Lighbox only showing data of the current post in Wordpress

I wanted to show some lightbox funtionality with the use of shortcodes. The code is working fine except for the data shown in the ligthbox. It only shows the data from the latest post in the loop. How can i manage to get lightbox showing the data belonging to the post?
<?php
// Posts are found
if ( $posts->have_posts() ) {
while ( $posts->have_posts() ) :
$posts->the_post();
global $post;
?>
<center>
<div id="su-post-<?php the_ID(); ?>" class="su-post">
<?php if ( has_post_thumbnail() ) : ?>
<a class="su-post-thumbnail" href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a>
<?php endif; ?>
<div class="su-post-excerpt">
<!-- Shows the button and the hidden lightbox -->
<?php echo do_shortcode ('[su_lightbox type="inline" src="#showInfo"][su_button] Info[/su_button][/su_lightbox]'); ?>
<!-- Shows the lightbox if button is clicked with the data -->
<?php echo do_shortcode ('[su_lightbox_content id="showInfo"][su_meta key="info" default="Geen tekst"][/su_lightbox_content]'); ?>
<?php echo do_shortcode ('[su_lightbox type="inline" src="#showVideo"][su_button] Video[/su_button][/su_lightbox]'); ?>
<?php echo do_shortcode ('[su_lightbox_content id="showVideo"][su_video url="{su_meta key=video}"][/su_lightbox_content]'); ?>
<?php echo do_shortcode ('[su_lightbox type="inline" src="#showFoto"][su_button] Foto[/su_button][/su_lightbox]'); ?>
<?php echo do_shortcode ('[su_lightbox_content id="showFoto"][su_meta key="fotos" default="Geen fotos"][/su_lightbox_content]'); ?>
</div>
</div>
</center>
<?php
endwhile; echo do_shortcode ('[su_lightbox_content id="showInfo"][su_meta key="info" default="Geen tekst"][/su_lightbox_content]');
}
// Posts not found
else {
echo '<h4>' . __( 'Posts not found', 'shortcodes-ultimate' ) . '</h4>';
}
?>

By adding a counter in the while loop and using the variable in the shortcode SRC and ID fields. I needed unique ID's for each post.
$n = 0; /* Outside While Loop */
echo do_shortcode( '[su_lightbox type="inline" src="#showInfo'.$n.'"][su_button] Info[/su_button][/su_lightbox] ');
echo do_shortcode( '[su_lightbox_content id="showInfo'.$n.'"][su_meta key="info" default="Geen tekst"][/su_lightbox_content]' );
$n++; /* Inside While Loop */

How to make HTML form fields automatically change when an option selected on a select field

Let's say I have a form like this in my CodeIgniter project.
<?php echo form_open(); ?>
<select>
<?php foreach($status_list as $status): ?>
<option value="<?php echo $status->id; ?>"><?php echo $status->name; ?></option>
<?php endforeach; ?>
</select>
<!-- Show this only if status type is, let's say "E" -->
<input type="text" name="E_happened">
<!-- Show this only if status type is, let's say "S" -->
<input type="text" name="S_happened">
<?php echo form_close(); ?>
What I want to do is if an user select one status, according to the it's type, show a text field to get an input.
I've made a way to get a type of the status like this: http://localhost/myapp/index.php/status/type/{status_id} where users can pass status ID and it will "echo" the type of the status.
I want to receive it back to the HTML page via a JavaScript method and show those text input fields. How do I do that?
Thank you. :)

As you have jQuery tag, so i suggest you this:
$('select').change(function(){
var inp = this.value.trim();
$(this).parent().find('input[type="text"][name^="'+inp+'"]').show().siblings(':text').hide();
});

I have posted the sample flow as per you want to do. hope this will helpful for you.
PHP:
<?php echo form_open(); ?>
<select>
<?php foreach($status_list as $status): ?>
<option value="<?php echo $status->id; ?>"><?php echo $status->name; ?></option>
<?php endforeach; ?>
</select>
<!-- Show this only if status type is, let's say "E" -->
<input type="text" id="E_happened" name="E_happened">
<!-- Show this only if status type is, let's say "S" -->
<input type="text" id="S_happened" name="S_happened">
<?php echo form_close(); ?>
JAVASCRIPT :
$('select').change(function(){
var statusId = $(this).val();
var statusType = $.get("http://localhost/myapp/index.php/status/type/"+statusId);
if(statusType == 'E')
{
$('#E_happened').value("what do you want here");
}
if(statusType == 'S')
{
$('#S_happened').value("what do you want here");
}
});

I can't reload the Captcha of my contact form

I'm creating my web page using Yii. When I created the page, Yii created a form very similar than the following:
<?php
/* #var $this SiteController */
/* #var $model ContactForm */
/* #var $form CActiveForm */
$this->pageTitle=Yii::app()->name . ' - Contact';
$this->breadcrumbs=array(
'Contact',
);
?>
<?php if(Yii::app()->user->hasFlash('contact')): ?>
<div class="flash-success">
<?php echo Yii::app()->user->getFlash('contact'); ?>
</div>
<?php else: ?>
<div class="form">
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'contact-form',
'enableClientValidation'=>true,
'clientOptions'=>array(
'validateOnSubmit'=>true,
),
)); ?>
<p class="note"><?php echo Yii::t('app','Fields with');?> <span class="required">*</span> <?php echo Yii::t('app','are required.');?></p>
<?php echo $form->errorSummary($model); ?>
<div class="row">
<?php echo $form->labelEx($model,'name'); ?>
<?php echo $form->textField($model,'name'); ?>
<?php echo $form->error($model,'name'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'email'); ?>
<?php echo $form->textField($model,'email'); ?>
<?php echo $form->error($model,'email'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'subject'); ?>
<?php echo $form->textField($model,'subject',array('size'=>60,'maxlength'=>128)); ?>
<?php echo $form->error($model,'subject'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'body'); ?>
<?php echo $form->textArea($model,'body',array('rows'=>6, 'cols'=>50)); ?>
<?php echo $form->error($model,'body'); ?>
</div>
<?php if(CCaptcha::checkRequirements()): ?>
<div class="row">
<?php echo $form->labelEx($model,'verifyCode'); ?>
<div>
<?php $this->widget('CCaptcha'); ?>
<?php echo $form->textField($model,'verifyCode'); ?>
</div>
<div class="hint"><?php echo Yii::t('app','Please enter the letters as they are shown in the image above.');?>
<br/><?php echo Yii::t('app','Letters are not case-sensitive.');?></div>
<?php echo $form->error($model,'verifyCode'); ?>
</div>
<?php endif; ?>
<div class="row buttons">
<?php echo CHtml::submitButton('Submit'); ?>
</div>
<?php $this->endWidget(); ?>
</div><!-- form -->
<?php endif; ?>
In the begining, this form worked, but after that, I improved the web page adding more features. Few minutes ago, I was checking all the page and I saw that the reloaded captcha button didn't work. Now, When I try to reload the captcha, the web page is reloaded and display a empty page with this code:
{"hash1":774,"hash2":774,"url":"\/MyApp\/site\/captcha.html?v=526045d3d1187"}
I tried to search for some similar error in google, but I didn't find anything. To be honest, I don't understand what is happening. I guess that the code that I added in another file of my web page produce this error, but I don't have any idea...I don't understand what means this code.
Please, I need your help!
Someone could help me? THANKS
EDIT:
If I look the source code of the web page on my browser, and I search for "captcha.html", I can see the following code:
<script type="text/javascript">
/*<![CDATA[*/
jQuery(function($) {
jQuery('#yw0').after("<a id=\"yw0_button\" href=\"\/MyApp\/site\/captcha.html?refresh=1 \">Obtenga un nuevo c\u00f3digo<\/a>");
jQuery(document).on('click', '#yw0_button', function(){
jQuery.ajax({
url: "\/MyApp\/site\/captcha.html?refresh=1",
dataType: 'json',
cache: false,
success: function(data) {
jQuery('#yw0').attr('src', data['url']);
jQuery('body').data('captcha.hash', [data['hash1'], data['hash2']]);
}
});
return false;
});
But I didn't find the captcha.html in any place...
EDIT 2:
I found the problem. I added javascript code at the end of the main page of my wep page. I added this:
<script type="text/javascript" src="<?php echo Yii::app()->theme->baseUrl; ?>/scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="<?php echo Yii::app()->theme->baseUrl; ?>/scripts/jquery-ui-1.8.12.custom.min.js"></script>
<script type="text/javascript" src="<?php echo Yii::app()->theme->baseUrl; ?>/scripts/jquery-photostack.js"></script>
<script type="text/javascript" src="<?php echo Yii::app()->theme->baseUrl; ?>/scripts/jquery-coin-slider.min.js"></script>
If I remove this code, the captcha can be reload correctly. Please, someone could tell me what I'm doing badly here? Why my javascript code produce this? How can I solve it?

The problem is this code in CCaptcha Yii widget:
jQuery(document).on('click', '$selector', function(){
jQuery.ajax({
...
});
return false;
});
The click listener is on document, instead of the element itself. When you add your script tags after this code, you load a new jQuery version that clears all those listeners on init.
To solve this, use only one jQuery version, preferably Yii included one.
If you really want to replace it, do it the right way, in CClientScript->scriptMap in config, set the value of jquery.js and jquery.min.js keys to the new URL of jQuery.

Categories