Making a link to change src on iframe - php

I have some javascript/jquery code in PHP:
$theframe='thisbox';
echo "<a href='#' onClick=\"\$('#$theframe').attr('src','http://google.com';\">
<span class='lin'>$titlehere</span></a>";
When clicked, I want it to update the iframe on the page with id='theframe' to something else (like google here) and without refreshing the page.
It's not working. Any ideas?
EDIT: For future reference, here is what I've used.
Foo
<iframe name="myiframe"></iframe>
From:
Basic jQuery question: How to change iframe src by clicking a link?

Give the frame a name, then use the target attribute, forget JS.
Example
<iframe name="myFrame" src="http://example.com/">
Alternative content for non-frame systems
</iframe>

create a new div and set its "innerHTML" value by each click. The innerHTML value then contains a new iframe with its source.

you need to prevent the link's default behaviour with event.preventDefault().
I'd also split html and javascript:
PHP:
echo "<a href='#' id='someID'><span class='lin'>$titlehere</span></a>";
JS:
$('#someID').click(function(ev){
$('#theframe').attr('src','http://google.com');
ev.preventDefault();
});

Related

How to carry value in query string By using button tag

echo "<td><a href='edit.php?corp_no=".$query2['corp_no']."'>OK</a></td>";
echo "<td><a href='delete_form.php?corp_no=".$query2['corp_no']."'>Cancel</a></td>";
For above case, I wanna know how to write it with button tag?
It's important to remember that a button 'does something' and a link 'goes somewhere' (actually changes the URI).
Currently there is no way to accomplish what you want via a button.
You can however pass information to a server within a <form> by using the value attribute on a <button>.
Perhaps an even better solution would be to style a <a> (link) to look like a button.
Either format your <a> tags with CSS to look like a button and call it a day, or you'll be using Javascript to accomplish this.
<button> tag:
echo "<td><button onclick='window.location.href=\"edit.php?corp_no=".$query2['corp_no']."\";'>OK</button></td>";
Php can be written directly with HTML
<button type="button" formaction="delete_form.php?corp_no='<?php echo $query2['corp_no'] ;?>'">Cancel</button>
The same method can also be used for OK button

Make jQuery do the click function

I don't know which tag or event to use. But I would like some way to make jQuery do a click function or "click" a link when the page is loaded. The script is getting a specific data from the URL. If the url sais: www.domain.com/index.php?a=1&b=1234 then I would like something like this in the beginning:
<?php$a = $_GET['a'];$b = $_GET['b'];if ($a == '1') {//echo jQuery script that automatically clicks the <a> tag}?>
and then the HTML script is like this:
jQuery Click
Please help me
You'll need the .trigger method.
$('a#YOUR_ID').click();
or
$('a#YOUR_ID').trigger('click');
or
$('a.YOUR_CLASS').click();
or using href
$('a[href^="page2.php"]').click();
First one is preferred. You should make selector with your ID of CLASS belongs to that a.
NOTE: a[href="page2.php"] means a tag which href beginning exactly with page2.php
If none of above works then try:
window.location = document.location.hostname + '/' + $('a[href^="page2.php"]').attr('href');
Two open a popup try this:
var urlToOpen = document.location.hostname + '/' + $('a[href^="page2.php"]').attr('href');
window.open (urlToOpen,"mywindow","menubar=1,resizable=1,width=350,height=250");
Detail about window.open()
Do this :
$("a[href='page2.php']").click();
or prefferably use an ID
$("a#myID").click();
You can get more information in the jQuery documentation or perhaps a tutorial at jQuery.
To answer your specific question, I believe you are looking for something similar to:
$(document).ready(function() {
$('#autoclick').click();
});
My recommendation would be to apply an id in the corresponding html:
<a id="autoclick" href="/somewhere-else">This is a link</a>
Hope that helps you get started.
Note: The click() has this as a specific shortcut for trigger("click") since v1.0. Ref: jQuery click

Need to show id in href tag but not navigate into other page

I need to show item id in a href tag ,but it must not navigate into other page... one way to prevent navigation is using jvascriptvoid(0) but can i append it to id... If so how??
<img height="57" width="57" src="images/portfolio_uploads/orig_'.$portfolio_item['image'].'">
Add onclick="return false;" to your anchor tag. This will prevent the link from being navigated to.
<img height="57" width="57" src="images/portfolio_uploads/orig_'.$portfolio_item['image'].'" />
However, I don't understand the point of this, and this isn't want the anchor tag is designed for. Perhaps if you supply more information we can find a better solution.
Assign a click event and return false, this will stop the browser from navigating to the href.
<script type="text/javascript">
window.onload = function()
{
document.getElementById("mylink").onclick = function()
{
return false;
}
}
</script>
<a id="mylink" href="http://google.com"><img height="57" width="57" src="images/portfolio_uploads/orig_'.$portfolio_item['image'].'"></a>
Add "#" character in-front of the id, it wont navigate to other page.
<img height="57" width="57" src="images/portfolio_uploads/orig_'.$portfolio_item['image'].'" />
You shouldn't use an <a> tag in first place. You can always use another kind of tag to display information. Specially since the contents of your href attribute aren't really valid links. Using an id attribute in your enclosed <img> should be even better.
<img id="'.$portfolio_id.'">
Or adapting your layout would be a better approach.

Trying to load a different iframe within a div popup box depending on which of several links is clicked to open the box

I have an overlay popup box (DIV + JavaScript + some CSS) which is toggled by a link, like this:
<a href="#" onclick="popup('popUpDiv')">
The box that pops up contains an iframe. Now I want different links on my page to load different iframes when the box opens; so that link A would toggle the box to appear, and load iframe1.html inside the box, while link B would toggle the same box to appear, but load iframe2.html inside the box, and so forth.
I'm a beginning programmer, and I first figured maybe this could be done with PHP, by putting something like this inside the popUpDiv:
<iframe src="http://mysite.com/iframe<?php echo $_GET ["iframeid"] ?>.html">
... and then simply adding ?iframeid=x to each link's href, where x is the id of the iframe to be loaded.
This obviously won't work in practice though, because it requires a page reload, and when the link is clicked, the popUpDiv is toggled to open, but at the same instant, the page reloads, now with the ?iframeid=x query string in place, but too late, since the popUpDiv disappeared on reload.
Is there perhaps a JavaScript equivalent that could be used, or can anybody suggest another way to make this work?
FYI, this is the kind of popup box I'm working with:
http://www.pat-burt.com/csspopup.html
I finally found a really simple way of accomplishing this without additional JavaScripting, by simply using the target attribute:
<iframe name="myfavoriteiframe">
Then:
This is a link.
P.S. Just FYI for any of those out there who might want to use this feature with Vimeo's JavaScript API, as I'm doing: In order to make API buttons work with this target method, it seems like the iframe src-attribute cannot be left blank. You need to specify a link to any of your videos in the src, so that a video loads into the iframe on page load, like this:
<iframe name="myfavoriteiframe" id="player_1" src="http://player.vimeo.com/video/[the_number_of_your_video]?api=1&player_id=player_1">
I simply inserted the URL to the first video on my page, but you can use any of them, since they're hidden anyway.
Then link to any of your videos using the target method described above, and the pre-set iframe video will be replaced by a video of your choice.
Create two divs with the two variations of content (the two iframes with each specific URL). Then toggle by the name of the div.
<a href="#" onclick="popup('popUpDiv1')">
<a href="#" onclick="popup('popUpDiv2')">
Set the id attributes of the div elements appropriately.
Rather than adding something to the popup DIV element, I would add a required link to the href property of the link that you use to open the popup:
<a href="http://example.com/first/uri" onclick="pre_popup('popUpDiv')">
<a href="http://example.com/first/uri" onclick="pre_popup('popUpDiv')">
<a href="http://example.com/first/uri" onclick="pre_popup('popUpDiv')">
And then inside the popup function I would take the href parameter of the link that has triggered the event and use it in a popup:
function pre_popup(id) {
// Take the href parameter of the link
var href = this.href;
// And then use it in the iframe
window.frames["your_iframe"].src = href;
// And then pop it
popup(id);
}

Open link in iframe and then open another link in same window

I have this code:
echo 'Send map to 2nd screen';
Id like to be able to press this link, which opens the case_util.php in another iframe and then goes to another link in its own iframe.
Sort of like a refresh/going back. However, it is a form, and pressing back retains the data in the form. I dont want this data in the form, hence I'd like it to navigate to the page.
Thanks :)
Syntax issues. document.location is not a function and is deprecated anyway.
Here is a better version
echo 'Send map to 2nd screen';
or easier to read since you want the href in the iframe named second .
...?> <a href="case_util.php?status=green&adr=<?php echo $adr; ?>" rel="nofollow" target="second"
onClick="window.location='create.php'" >Send map to 2nd screen</a>
Best answer:
Don't use iframes.
However if you are determined to use something as silly as an iframe, use something as silly as a meta redirect.
<meta http-equiv="refresh" content="0;url=http://example.com/"/>
;) seriously, just read about AJAX+jQuery instead:
http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/

Categories