I try to change html element, on php if statement, I tried this:
<?if ($item['DISCOUNT_PRICE']<$item['PRICE'] AND $item['DISCOUNT_PRICE']>0):?>
<?//MM-227?>
<div class="catalog-product__old-price-outer">
<?=price($item['PRICE'], $item['CURRENCY'])?>
</div>
<?//MM-227?>
<script>
$(".inner-price-block .price-offer").css("color","red");
</script>
<?endif;?>
<div class="inner-price-block">
<div id="sku_price_<?=$item['ID']?>" class="price-offer">
<?=price($item['DISCOUNT_PRICE'], $item['CURRENCY']);?>
</div>
</div>
I try to change class price-offer, with this script:
<script>
$(".inner-price-block .price-offer").css("color","red");
</script>
what I missed?
Try this :
<script>
$(document).ready(function() {
$(".inner-price-block .price-offer").css("color","red");
});
</script>
You can use php instead of jquery to put condition like below:
<?php $color="";
if ($item['DISCOUNT_PRICE']<$item['PRICE'] AND $item['DISCOUNT_PRICE']>0):
$color="red";?>
<?//MM-227?>
<div class="catalog-product__old-price-outer">
<?=price($item['PRICE'], $item['CURRENCY'])?>
</div>
<?php endif;?>
<div class="inner-price-block">
<div id="sku_price_<?=$item['ID']?>" class="price-offer" <?= ($color!=''?'style="color:'.$color.'":""'?>>
<?=price($item['DISCOUNT_PRICE'], $item['CURRENCY']);?>
</div>
</div>
Related
Can anyone tell me how I can get all the values on a specific attribute value on each loop ? I'm trying to get all the html values on each loop that has the specific attribute value( data-product=momentum-shorts ) <p>Two-Way Stretch </p> in this case..
This is my code
<script>
jQuery( document ).ready(function() {
$(".compare-main .compare-products").each(function(){
$(this).each(function(){
console.log($(this).html());
})
});
});
</script>
You can use the attribute equals selector :
$(".compare-main .compare-products [data-product='momentum-shorts']").each(function(){
console.log($(this).html().trim());
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="compare-main">
<div class="compare-products">
<div data-product="momentum-shorts">
<p>Two-Way Stretch</p>
</div>
<div data-product="foo">
<p>foo</p>
</div>
</div>
<div class="compare-products">
<div data-product="bar">
<p>bar</p>
</div>
<div data-product="momentum-shorts">
<p>Medium Weight</p>
</div>
</div>
</div>
You can use the jQuery attr() method
$(this).data('column') or $(this).data('product')
.data()
When click on click here it's still alert 0.
How can i count length div by id using javascript ?
function swipeDislike() {
var $photo = $("div.content").find('#photo');
alert($photo.length);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div onclick="swipeDislike()">
click here
</div>
<div id="content">
<div id="photo">
DIV content photo
</div>
</div>
Your selector is id not class.
Change var $photo = $("div.content").find('#photo');
To
var $photo = $("div#content").find('#photo');
Working Code Snippet:
function swipeDislike() {
var $photo = $("div#content").find('#photo');
alert($photo.length);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div onclick="swipeDislike()">
click here
</div>
<div id="content">
<div id="photo">
DIV content photo
</div>
</div>
You have a typo instead of div.content use div#content
$("div#content").find('#photo') instead of $("div.content").find('#photo')
But the best way would be to just use $(“div#content #photo”); this way you won't need to use two expensive jQuery calls. Thanks Jaromanda X :)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div onclick="swipeDislike()">
click here
</div>
<div id="content">
<div id="photo">
DIV content photo
</div>
</div>
<script>
function swipeDislike() {
var $photo = $("div#content #photo");
alert($photo.length);
}
</script>
I am using below code for onclick popup, but I need the same popup for onload - how can I solve this problem?
<div class="app">
<div class="canvas">
Demo — Explode Modal
</div>
</div>
<div id="explode" class="ui--modal explode">
<div>
clear
<h4>Boooooom!!!</h4>
<img src="assets/img/e2dshop.jpg" >
<!--close-->
</div>
<div class="bg">
<img src="assets/img/explode-med.gif" id="boooom">
</div>
</div>
Try this solution
<script>
jQuery('window').on('load', function(){
jQuery('#boooom').attr('src', 'assets/img/explode-med.gif');
});
</script>
As well include jQuery lib.
Try this
$(document).ready(function() {
$(".ui--button").click();
});
I have a template call game.php :
<div id="bonus-pub" class="not-display">
<section id="" class="generique">
<div id="">
content
<div id="rtr"></div>
<div id="gfgf class="not-display">
<h2>gfgf</h2>
<p>dsfdsfds</p>
<p class="GC_fdfdfd">
<a class="dfdf">Close</a> </p>
</div>
</div>
</section>
</div>
Now I have another view whitch is open as a popup after an action generique.php:
<section>
<?php require($file_view);?>
<script>
$(function(){
$('.modal').addClass('generic');
}())
</script>
And a have another file charge with js actions. In this file I need to create a .js call to load the <div id="bonus-pub" class="not-display"> into template generique.php, I tried :
<script>
document.getElementById('bonus-pub').setAttribute('class','display-block');
</script>
But this fonction only put the div into page not in popup windows. So the probleme is that I want to put <div id="bonus-pub" class="not-display"> from template game.php into generique.php after an action. Help me please!! Thx in advance!!!
Edit: Fixed the native JS and jQuery mix.
Have you tried this instead of using setAttribute:
<script>
document.getElementById('bonus-pub').style.display = "block";
</script>
Your requirement can be full filled using ajax. In game.php store all the div data in a php variable and echo that variable to the ajax call.
game.php
<?php
$ret = '<div id="bonus-pub" class="not-display">
<section id="" class="generique">
<div id="">
content
<div id="rtr"></div>
<div id="gfgf class="not-display">
<h2>gfgf</h2>
<p>dsfdsfds</p>
<p class="GC_fdfdfd">
<a class="dfdf">Close</a> </p>
</div>
</div>
</section>
</div>';
echo $ret;
?>
after your mentioned action make an ajax call for the game.php page
$.ajax({
url:'game.php',
method:'post',
success: function(response)
{
//you have your div data in this response
}
fail: function(response)
{
//your ajax request failed
}
});
I need to add a class to a div inside a shadowbox and I am using jQuery to do this.
jQuery("#all_records #"+id).addClass("selectedDiv");
In such circumstances, I usually check if I am calling the right div, and in this case it turns out I am. But unfortunately, it is never adding the class to the div.
<div id="all_records">
<div id="50157186" class="records_dealer_activation" onclick="select_customer(50157186);">
</div>
</div>
function select_customer(id){
jQuery('#sb-player #choosen_customer_activation_duplicate').prepend('<div class="overlay"> <div class="modalprogress"> <div class="theprogress"> <img class="image_load" src="<?php echo base_url();?>images/progress_bar.gif" alt="loadanimation" /></div> </div> </div> ');
jQuery("#sb-player #choosen_customer_activation_duplicate").load("<?php echo site_url().'/'.$main_controller;?>"+"/load_show_selected_customer_activation/?customerID="+id+"&type=duplicate");
if(jQuery("#all_records > div").hasClass("selectedDiv"))
{
//THIS IS WORKING
jQuery("#all_records > div").removeClass("selectedDiv");
}
//NOT WORKING
//alert(jQuery("#sb-player #all_records #"+id).html());
//document.getElementById(id).className += "selectedDiv";
jQuery("#all_records #"+id).addClass("selectedDiv");
}
Any suggestions?
Can you post your javacript function, btw this work for me:
<script type="text/javascript">
function select_customer(id){
jQuery("#" +id).addClass("selectedDiv");
}
</script>
<div id="all_records">
<div id="50157186" class="records_dealer_activation" onclick="select_customer(50157186);">
Click me
</div>
</div>