I am trying to use jqModal to open some external links via AJAX using this code:
<h3><a class="username<?php echo $row['id']; ?>trigger"><?php echo get_user_meta( $user_id, 'first_name', $single );?> <?php echo get_user_meta( $user_id, 'last_name', $single );?></a></h3>
<script type="text/javascript">$(document).ready(function() {$('#username<?php echo $row['id']; ?>').jqm({ajax: 'http://www.google.ro/', trigger: 'a.username<?php echo $row['id']; ?>trigger'});}); </script>
<div class="jqmWindow" id="username<?php echo $row['id']; ?>">Please wait... <img src="inc/busy.gif" alt="loading" /></div>
The problem is that it doesn't load but if I put an internal link it works. Someone can help me with this?
What you are trying to do is cross domain Ajax. Jqmodal and any other plugins will not be able to do that.
Jqmodal has an iframe method to pull in an external website. See point 7. On the jqmodal page.
You will need to use an API if the external site has one, or use server side code to 'scrape'
Related
Beginner JS here.
I am trying to add a PHP variable to a Javascript onclick function. I converted the PHP variable to a JS variable just fine. However, when adding the JS variable to the function I'm not receiving the desired output. What am I doing wrong?
<script>
js_logo_number = "<?php echo $logo_number; ?>";
</script>
<img src='<?php echo $image1[0]; ?>' onclick="openModal();currentSlide(js_logo_number)">
You can do like this :
<img src='<?php echo $image1[0]; ?>' onclick="openModal();currentSlide(<?php echo $logo_number; ?>)">
This code works for me. Be sure you use a let or const (or the outdated var) prefix to declare js_logo_number a new variable. Also make sure that $logo_number is set like this:
<script>
let js_logo_number = <?php isset($logo_number)?$logo_number:null; ?>;
</script>
Then make sure you convert it to an integer in Javascript, if that's how you want to use it:
function currentSlide(num){
console.log('currentSlide fired', parseInt(num));
}
let js_logo_number = "5";
function openModal(){
console.log('openModal fired');
}
function currentSlide(num){
console.log('currentSlide fired', parseInt(num));
}
<img src='https://placekitten.com/200/200' onclick="openModal();currentSlide(js_logo_number)">
When PHP parses a file, it looks for opening and closing tags, which are which tell PHP to start and stop interpreting the code between them. Parsing in this manner allows PHP to be embedded in all sorts of different documents, as everything outside of a pair of opening and closing tags is ignored by the PHP parser.
See: PHP tags
1) echo
<?php echo 'if you want to serve PHP code in XHTML or XML documents, use these tags'; ?>
Solution:
<img src='<?php echo $image_src ?>'
onclick="openModal();currentSlide(<?php echo $logo_number ?>)">
2) Short echo
You can use the short echo tag to <?= 'print this string' ?>.
It's equivalent to <?php echo 'print this string' ?>.
Solution:
<img src='<?= $image_src ?>'
onclick="openModal();currentSlide(<?= $logo_number ?>)">
3) If short_open_tag is enabled
<? echo 'this code is within short tags, but will only work '
.'if short_open_tag is enabled'; ?>
Solution:
<img src='<? echo $image_src ?>'
onclick="openModal();currentSlide(<? echo $logo_number ?>)">
See: PHP tags
I have a button in menu section with link to pop-up.
I want to make so that it was opened in the same tab.
Here is the code of this button:
<button
class="btn btn-bg-no btn-border-green btn-color-green hvr hvr-buzz-out"
onclick="window.open('<?php echo esc_url( $menu_btn_url ); ?>', '_blank')">
<?php echo esc_html( $menu_btn ); ?>
</button>
I was trying to change '_blank' to '_self'. It changes the url, but my pop-up didn't appear. What can I do?
If you look at the docs for window.open() you'll see the second parameter is actually for naming the window if it doesn't reference an existing context, and webkit (chrome) has been having issues for the longest time with this.
You mention the button triggers a pop-up, but _self would basically treat it like you're clicking on a standard link, no? You may be better off using a standard link:
<a class="btn btn-bg-no btn-border-green btn-color-green hvr hvr-buzz-out" href="<?php echo esc_url( $menu_btn_url ); ?>">
<?php echo esc_html( $menu_btn ); ?>
</a>
If for some reason you want an onclick event, you'd probably be better suited using window.location.href instead of window.open:
<button class="btn btn-bg-no btn-border-green btn-color-green hvr hvr-buzz-out" onclick="window.location.href = '<?php echo esc_url( $menu_btn_url ); ?>'">
<?php echo esc_html( $menu_btn ); ?>
</button>
Also, a side note your SSL certificate on your website isn't working as it's issued to auditerra.ru and not intererka.auditerra.ru or *.auditerra.ru
I am using codeigniter version 2.1.0 the <?= ?> tags not working,
I have applied the tags like this <?=$company['name']?> and i tried <?= $company['name']?> and <?php $company['name']?> none of these are working
The short_open_tag configuration directive is probably set to false on your server.
You also forgot the echo in your last call, it should read:
<?php echo($company['name']); ?>
Since the echo shorthand only works for the short tag, i.e. <?= ... ?> and not for <?php= ... ?>
If you've ever worked with OpenCart and you're a stickler for correct markup and optimization then you know already what a pain in the * it is.
There is inline js all through the templates since it relies on php variables in the templates to execute the js.
I'm currently working on an HTML5 fork of OC that moves all of this crap out of the templates and moves all the linked js files to the bottom of the page where they are supposed to be.
The problem is a have a client that wants this now, and it will take weeks to move all this scripting properly, so I'm trying to find a reliable way to defer the inline scripting so that it will only execute once all the files have loaded at the bottom.
I tried using defer on the script tag, but Chrome still executes it immediately as soon as it finds it, and I imagine most other browsers will too.
For example here's the carousel module:
<div id="carousel<?php echo $module; ?>" class="es-carousel-wrapper">
<div class="es-carousel">
<ul>
<?php foreach ($banners as $banner) { ?>
<li>
<a href="<?php echo $banner['link']; ?>">
<img src="<?php echo $banner['image']; ?>"
alt="<?php echo $banner['title']; ?>"
title="<?php echo $banner['title']; ?>" />
</a>
</li>
<?php } ?>
</ul>
</div>
</div>
<script type="text/javascript" defer>
$('#carousel<?php echo $module; ?>').elastislide({
speed : 450,
easing : '',
imageW : 290,
<?php if ($limit > 3): ?>
minItems : <?php echo $scroll; ?>
<?php else: ?>
minItems : 1
<?php endif ?>
});
$(window).triggerHandler('resize.elastislide');
</script>
As you can see it's much easier to keep it in the template page and just use the variables from the php, obviously the right way to do this is to implement the variables into js and call them later which is what I did for another client, but that took a long time to do.
Is there a reliable way to implement this using defer?
Thanks.
-Vince
I've searched and found out solutions to preload images IF I have their file names. However my gallery and images are dynamic so it runs a php echo image url code to call my images.
<a href="<?php echo $image->imageURL ?>" <?php echo $image->thumbcode ?> >
<?php if ( !$image->hidden ) { ?>
<img title="<?php echo $image->alttext ?>" alt="
<?php echo $image->alttext ?>" src="<?php echo $image->thumbnailURL ?>"
<?php echo $image->size ?> />
<?php } ?></a>
What can I do to preload the next 2 or 3 images in the gallery since I wont be able to give the exact image file for each of my galleries. The only solution I found was to make all the images preload which I don't want.
You can probably hide your images when page load and you can run your preload image function
$('#gallery img').hide();
$('#gallery img').each(function(e) {
$(this).delay(500*e).fadeIn('slow');
})
I'm not clear as to what you're asking, but you can't load a resource without knowing it's path.
Also, I assume $image->size returns the string width="X" height="Y". You'll probably be better off having a height and width property, or store the dimensions in an array.
if($image->width) {
echo 'width="' . $image->width . '"';
}