This code works just fine in Chrome & Firefox - but fails in IE & Safari.
<script type="text/javascript">
$(document).ready(function() {
alert('1');
<?php foreach($options as $option): ?>
<?php if($option['option_choice'] == 1): ?>
var choiceid = <?php echo $option['product_option_id']; ?>;
<?php foreach ($option['option_value'] as $option_value): ?>
<?php if($option_value['whatsize'] == 2): ?>
var choicebigid = <?php echo $option_value['product_option_value_id']; ?>;
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
<?php endforeach; ?>
alert('2');
$('#'+choiceid+''+2).hide();
});
</script>
Alert 1 +2 shows in Chrome/FF, but only Alert 1 shows in IE.
---Generated Chrome JS---
<script type="text/javascript">
$(document).ready(function() {
alert('1');
var choiceid = '321'; //Produktvalg ID
var choicebigid = '1111';
$('#'+choiceid+''+2).hide();
document.getElementById(choiceid+''+2).style.display = 'none';
alert(choiceid);
});
</script>
---Generated IE JS---
<script type="text/javascript">
$(document).ready(function() {
alert('1');
var choiceid = '321'; //Produktvalg ID
var choicebigid = '1111';
$('#'+choiceid+''+2).hide();
document.getElementById(choiceid+''+2).style.display = 'none';
alert(choiceid);
});
</script>
---Update---
Adding single quotes seemed to help generating the IE JS code - before it was empty.
This also added the style="display:none;"
New problem is that hiding an option is not supported in IE and Safari. Will disable the option along hiding it as well.
---Status---
Fixed. End problem seemed to be hiding and
Try with single quote
var choiceid = '<?php echo $option['product_option_id']; ?>';
var choicebigid = '<?php echo $option_value['product_option_value_id']; ?>'
Related
Hi the code below is for my search page and its working properly and it will show the search item along with the map marker what im trying to do now is show all post from the category example "category1", "category2" how can i do that? thank you so much
<div id="posts_cont">
<?php
while ($search_query->have_posts()) : $search_query->the_post();
$post_id = get_the_ID ();
$location = get_field_object('gmap', $post_id)['value'];
$title = get_the_title($post_id);
$url = get_permalink($post_id);
$comments = get_comments(array('post_id' => $post_id));
//$ratings = rating_form();
$thumb_id = get_post_thumbnail_id($post_id);
$thumb_url_array = wp_get_attachment_image_src($thumb_id, 'thumbnail', true);
$thumb_url = $thumb_url_array[0];
if( !empty($location) ):
?>
<script type="text/javascript">
$(".acf-map").append("<div class='marker' data-lat='<?php echo $location['lat']; ?>' data-lng='<?php echo $location['lng']; ?>' title='<?php echo the_title_attribute(); ?>' ></div>");
</script>
<?php endif; ?>
<?php endwhile; ?>
<?php if (!have_posts() || $search_query->post_count == 0) { ?>
<script type="text/javascript">
$("#search-title").hide();
$(".acf-map").hide();
$(".search-text").hide();
$(".container").append("<h6 class='title'>Oops! No results were found.</h6>");
</script>
<?php } ?>
HTML:
The field below is being loaded dynamically, more than once.
<div>
<label><?php echo $form->label; ?>
<select
name=<?php echo $form->name; ?>
idx=<?php echo $form->entity; ?>
>
<option value="<?php echo $form->option()->value; ?>"><?php echo $form->option()->name; ?></option>
</select>
<td>
[Open] Add New
<span id="addfield">
<input name="newstuff type="text"></input>
</span>
Click to add
</td>
</div>
JAVASCRIPT:
I can make the script below load twice, or once. If I load it once, then it only works for the first field. If I load it twice, then it only works for the second field.
<script type="text/javascript">
var onix = false;
function onOffButton(id, text) {
var select_id = $("#addfield").prevAll('select').attr("idx");
console.log(select_id);
if (onix == false) {
document.getElementById(id).style.display = 'block';
document.getElementById(text).style.display = 'block';
document.getElementById("addnew").textContent="[Close] Add New";
onix = true;
} else if (onix == true) {
document.getElementById(id).style.display = 'none';
document.getElementById(text).style.display = 'none';
document.getElementById("addnew").textContent="[Open] Add New";
onix = false;
}
}
</script>
SUMMARY
I need to know which element the section addfield belongs to. Most importantly, the form->entity. The goal is to generate a GET link like so: localhost/$form->entity/create/[value-of-newstuff]
I tried setting an array on an external file. And that does work, but I don't know what to do with it.
I also tried using <?php echo rand(); ?> on all of the attributes. The results were as expected, when javascript loads once it only works for the first field, loads twice, only works for the second field.
How can I overcome this obstacle?
I solved it for now
In a very crude way, there's probably a more beautiful way, but this is what I came up with to solve it.
Basically I started the field with:
<?php $onix = rand(); ?>
Then I slapped that crap on every id of the html. On the javascript side I slapped it basically everywhere. It's ugly as a mofo but it works like a charm:
<script type="text/javascript">
var onix<?php echo $onix; ?> = false;
function onOffButton<?php echo $onix; ?>(id<?php echo $onix; ?>, text<?php echo $onix; ?>) {
var select_id<?php echo $onix; ?> = $("#addfield<?php echo $onix; ?>").prevAll('select').attr("idx<?php echo $onix; ?>");
console.log(select_id<?php echo $onix; ?>);
if (onix<?php echo $onix; ?> == false) {
document.getElementById(id<?php echo $onix; ?>).style.display = 'block';
document.getElementById(text<?php echo $onix; ?>).style.display = 'block';
document.getElementById("addnew<?php echo $onix; ?>").textContent="[Close] Add New";
onix<?php echo $onix; ?> = true;
} else if (onix<?php echo $onix; ?> == true) {
document.getElementById(id<?php echo $onix; ?>).style.display = 'none';
document.getElementById(text<?php echo $onix; ?>).style.display = 'none';
document.getElementById("addnew<?php echo $onix; ?>").textContent="[Open] Add New";
onix<?php echo $onix; ?> = false;
}
}
</script>
I have these two scripts.
First:
$(document).ready(function(){
refreshStatus();
});
function refreshStatus(){
setTimeout(function(){
$('#div_top_info').load('load_status.php');
}, 2000);
}
Second:
var skill = <?php echo json_encode($skill_, JSON_UNESCAPED_UNICODE); ?>;
var skill_final = <?php echo json_encode($skill_final, JSON_UNESCAPED_UNICODE); ?>;
var camp_final = <?php echo json_encode($camp_final, JSON_UNESCAPED_UNICODE); ?>;
var jmeno = <?php echo json_encode($jmeno_, JSON_UNESCAPED_UNICODE); ?>;
var pozice = <?php echo json_encode($pozice_, JSON_UNESCAPED_UNICODE); ?>;
var delka = <?php echo json_encode($delka_, JSON_UNESCAPED_UNICODE); ?>;
var opravneni = <?php echo json_encode($opravneni, JSON_UNESCAPED_UNICODE); ?>;
$(document).ready(function(){
refreshPrehled();
});
function refreshPrehled(){
$('#checkboxes').load('load_prehled.php', {
skill: skill,
skill_final: skill_final,
camp_final: camp_final,
jmeno: jmeno,
pozice: pozice,
delka: delka,
opravneni: opravneni
}, function(){
setTimeout(refreshPrehled, 12000);
});;
}
Second is below first on my page.
Does this mean only one setTimeout can run on one page?
And if thats the case, how do I put these two together into one script when I wanna load two different .php into two different html objects?
Thanks for help!
EDIT
Also html objects:
<div class="div_top_info" id="div_top_info"></div>
<form action="index.html" method="POST" id="checkboxes"></form>
I have tried different variations of timeouts, setInterval, different positioning, delay one of the timeouts. Really don't know. I fight this second day now.
EDIT2
Important info:
Sorry bad info.
They load, but into each php (load_status and load_prehled) I put this code:
$z_cas_editace = date('Y-m-d H:i', filemtime('datazelva_UL.txt'));
And second one updates the time and first one doesn't.
The first function also works fine when I put it in place of second.
Just my head spinning...
var skill = <?php echo json_encode($skill_, JSON_UNESCAPED_UNICODE); ?>;
var skill_final = <?php echo json_encode($skill_final, JSON_UNESCAPED_UNICODE); ?>;
var camp_final = <?php echo json_encode($camp_final, JSON_UNESCAPED_UNICODE); ?>;
var jmeno = <?php echo json_encode($jmeno_, JSON_UNESCAPED_UNICODE); ?>;
var pozice = <?php echo json_encode($pozice_, JSON_UNESCAPED_UNICODE); ?>;
var delka = <?php echo json_encode($delka_, JSON_UNESCAPED_UNICODE); ?>;
var opravneni = <?php echo json_encode($opravneni, JSON_UNESCAPED_UNICODE); ?>;
$(document).ready(function(){
refreshStatus();
refreshPrehled();
});
function refreshStatus(){
setTimeout(function(){
$('#div_top_info').load('load_status.php');
}, 2000);
}
function refreshPrehled(){
$('#checkboxes').load('load_prehled.php', {
skill: skill,
skill_final: skill_final,
camp_final: camp_final,
jmeno: jmeno,
pozice: pozice,
delka: delka,
opravneni: opravneni
}, function(){
setTimeout(refreshPrehled, 12000);
});;
}
<?php if(isset($_SESSION['logged_in'])) {
$somevar= "something";
?>
<script type="text/javascript">
var somevar2 = <?php echo $value; ?>;
</script>
<?php } ?>
I put the code inside <head>, the console shows somevar2 is undefined, I was expecting the script don't run because it put in a scope where it execute only when user is logged in. What is the cause of this problem?
<?php if(isset($_SESSION['logged_in'])) {
$somevar= "something";
?>
<script type="text/javascript">
var somevar2 = <?php echo $somevar; ?>;
</script>
<?php } ?>
That should do the job. My guess is that you just forgot to change the variable echoed.
After doing a clean install of Magento Community Edition (v. 1.7.0.2) in my local machine and loading it with sample data provided by Magento, I can browse reviews, add items to cart, etc., as expected.
However, when I follow the same steps on a live server, JS functionality does not work, neither in Chrome nor in Firefox (I have not tried other browsers). For instance, clicking on 'Add to Cart' on a product page gives me nothing but a console error ("Uncaught ReferenceError: productAddToCartForm is not defined").
What is causing this behaviour, and how can I fix it?
I'm not sure if this will help you, but it fixed my problem. What I did was I moved the javascript segment in view.phtml from under "the add-to-cart-wrapper" class to above it.
Like so:
<script type="text/javascript">
//<![CDATA[
var productAddToCartForm = new VarienForm('product_addtocart_form');
productAddToCartForm.submit = function(button, url) {
if (this.validator.validate()) {
var form = this.form;
var oldUrl = form.action;
if (url) {
form.action = url;
}
var e = null;
try {
this.form.submit();
} catch (e) {
}
this.form.action = oldUrl;
if (e) {
throw e;
}
if (button && button != 'undefined') {
button.disabled = true;
}
}
}.bind(productAddToCartForm);
productAddToCartForm.submitLight = function(button, url){
if(this.validator) {
var nv = Validation.methods;
delete Validation.methods['required-entry'];
delete Validation.methods['validate-one-required'];
delete Validation.methods['validate-one-required-by-name'];
// Remove custom datetime validators
for (var methodName in Validation.methods) {
if (methodName.match(/^validate-datetime-.*/i)) {
delete Validation.methods[methodName];
}
}
if (this.validator.validate()) {
if (url) {
this.form.action = url;
}
this.form.submit();
}
Object.extend(Validation.methods, nv);
}
}.bind(productAddToCartForm);
//]]>
</script>
<div class="add-to-cart-wrapper">
<?php echo $this->getChildHtml('product_type_data') ?>
<?php echo $this->getChildHtml('extrahint') ?>
<?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') ?>
<?php echo $this->getChildHtml('sharing') ?>
</div>
<?php echo $this->getChildHtml('extra_buttons') ?>
<?php elseif (!$_product->isSaleable()): ?>
<div class="add-to-box">
<?php echo $this->getChildHtml('addto') ?>
<?php echo $this->getChildHtml('sharing') ?>
</div>
<?php endif; ?>
</div>
Instead of:
<div class="add-to-cart-wrapper">
<?php echo $this->getChildHtml('product_type_data') ?>
<?php echo $this->getChildHtml('extrahint') ?>
<?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') ?>
<?php echo $this->getChildHtml('sharing') ?>
</div>
<?php echo $this->getChildHtml('extra_buttons') ?>
<?php elseif (!$_product->isSaleable()): ?>
<div class="add-to-box">
<?php echo $this->getChildHtml('addto') ?>
<?php echo $this->getChildHtml('sharing') ?>
</div>
<?php endif; ?>
</div>
<?php echo $this->getChildHtml('related_products') ?>
<div class="clearer"></div>
<?php if ($_product->isSaleable() && $this->hasOptions()):?>
<?php echo $this->getChildChildHtml('container2', '', true, true) ?>
<?php endif;?>
</form>
<script type="text/javascript">
//<![CDATA[
var productAddToCartForm = new VarienForm('product_addtocart_form');
productAddToCartForm.submit = function(button, url) {
if (this.validator.validate()) {
var form = this.form;
var oldUrl = form.action;
if (url) {
form.action = url;
}
var e = null;
try {
this.form.submit();
} catch (e) {
}
this.form.action = oldUrl;
if (e) {
throw e;
}
if (button && button != 'undefined') {
button.disabled = true;
}
}
}.bind(productAddToCartForm);
productAddToCartForm.submitLight = function(button, url){
if(this.validator) {
var nv = Validation.methods;
delete Validation.methods['required-entry'];
delete Validation.methods['validate-one-required'];
delete Validation.methods['validate-one-required-by-name'];
// Remove custom datetime validators
for (var methodName in Validation.methods) {
if (methodName.match(/^validate-datetime-.*/i)) {
delete Validation.methods[methodName];
}
}
if (this.validator.validate()) {
if (url) {
this.form.action = url;
}
this.form.submit();
}
Object.extend(Validation.methods, nv);
}
}.bind(productAddToCartForm);
//]]>
</script>
</div>
I hoped this helped.
A colleague fixed this issue. There were two problems that were causing magento to fail on the live server:
Missing dependencies for PHP (dom and gm) which Magento was not complaining about.
A low memory limit in PHP. We needed to increase the memory_limit setting in /etc/php.ini (512M worked for us).