I'm building a little upload script. My form has a target to an iFrame and the iFrame locates on the same page as the form.
In the code of the iFrame I upload the files to my server. If the upload is finished i want to run a little jQuery inside the iFrame to hide a div on the parent page (where the form is located).
Strange thing is that the jQuery inside the iFrame doesnt work. If I try a simple
alert('bla bla bla'); it doesnt show.
Somebody now what i should do?
Thanks in advance!
the code of the iFrame:
<? if(isset($_POST['Q'])) { echo 'form is set';
echo $_POST['Q']; ?>
<script type="text/javascript" charset="utf-8">
// JavaScript Document
$(document).ready(function()
{
$('#test').show();
});
</script><? } ?><div id="test" style="display:none;">bla bla bla</div>
If you are using jquery withing iFrame you need to have references to JQuery libraries withing the Iframe itself.
Related
I am trying to insert my profile from the external website (url) to my blog.
Cross-domain is prohibited so iframe, AJAX and jquery load don't work. PHP file_get_contents() do but dynamically generated content inside page doesn't load.
Help me to understand why and how can I solve this issue?
I use such code:
<head>
<base href="https://bookmate.com/">
</head>
<?php
$url = 'https://bookmate.com/kirillmazur/finished';
echo file_get_contents($url);
?>
this is due to missing of two javascript file. you can try by adding those two files in to your local directiry
<script src="/javascript/core.js?4417dc0"></script>
<script src="/javascript/modules.js?4417dc0">
check all the missing files in local directory usinging browser console
Hope It will help. I had same problem Here is what I did:
I used iframe and javascript to get page with all the dynamically loaded contents
contents =document.getElementById('load_page1').contentWindow.document.documentElement.outerHTML;
I loaded the page in iframe
<iframe id="load_page1"></iframe>
jQuery(document).ready(function(){
var url="www.google.com"
jQuery('#load_page1').attr('src',url);
});
then from Javascript I get contents of that iframe in a variable on button click event and sent it through ajax by encoding it into base64
<input type="button" id="load_css" />
jQuery(document).on('click',"#load_css",function(){
contents =document.getElementById('load_page1')
.contentWindow.document.documentElement.outerHTML;
contents = btoa(contents);
jQuery.ajax({
url:'process.php',
data:{contents:contents},
method:"post"}).done(function(data){
jQuery('.css_target').html(data);
});
});
and on ajax page I did all the processing thorugh decodeing it back from base64 to string.
I'm trying to create a program on my server that enables me to pull information from different websites. It's already written in PHP and works perfectly. I gather this information from an iframe on one of my pages. When I use the original page that was loaded by the php script in the iframe, everything works fine. But, if I click on a link inside of the iframe, the src is different and I don't know how to access it. How do I figure out the NEW src of the <iframe> with jQuery? I searched this site and can't find a good answer to this. Below is an example of my code:
the PHP:
<?php
$link = $_POST['link'];
?>
<div id="button">Button</div>
<iframe src="<? echo $link;?>"></iframe>
<script type="text/javascript" src="something.com/jquery.js"></script>
<script type="text/javascript">
$('#button').click(function()
{
//alert iframe src
});
</script>
EDIT:
I current have this running, and it only alerts the original src when I click a link in the <iframe>. I'm needing it to alert the NEW src of the <iframe>.
<iframe id="blog_iframe" onload="iframeLoader();" height="600px" width="98%" src="<? echo $url;?>" scrolling="auto">
<p>Your current browser does not support iFrames. Please use a different browser</p>
</iframe>
<script type="text/javascript">
function iframeLoader()
{
alert($('iframe').attr("src"));
}
</script>
Use .attr()
$('#button').click(function() {
//alert iframe src
alert( $("iframe").attr("src") );
});
** EDIT **
According to Edited question.
You're actually trying to get src of <a> tag inside of <iframe> tag
Try this
alert( $("iframe").contents().find("a").attr("href") );
var iFrameSrc = $("iframe").attr('src');
I want to insert the jQuery plugin dropdown login form to make my website more pretty, but I am really confused where and how to insert jQuery into my code. For instance the following is my index.php:
<?php
include ('book_fns.php');
session_start();
do_html_header("Welcome to Store");
echo "<p>Please choose a category:</p>";
// Get categories out of database
$cat_array = get_categories();
// Display as links to cat pages
display_categories($cat_array);
//If logged in as admin, show add, delete, edit cat links.
if(isset($_SESSION['admin_user'])) {
display_button("admin.php", "admin-menu", "Admin Menu");
}
do_html_footer();
?>
And I want to add the jQuery plugin to the top of my index page.
How do I insert this jQuery plugin?
Get it straight from the CDN. Paste this code on your page's HEAD :
<HTML>
<HEAD>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</HEAD>
</HTML>
Then utilize the library just as you would with your usual javascript code just like this one:
<script>
$(document).ready(function() {
alert('Hey! I was called when the document finished loading.');
});
</script>
I think you should echo the tag to your index page like this:
echo "<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>"
Or you include an HTML/PHP file that contains jQuery script in the <head></head> tag
include('headScript.php');
Or you write a function that echo the <script></script> tag above:
echo $this->headScript("http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js");
protected function headScript($src){
return '<script type="text/javascript" src="$src"></script>';
}
Yes, just treat the JavaScript and jQuery code as you would HTML. The server reads the PHP code and the PHP code tells the server what to send to the browser, and the browser is what reads the jQuery and HTML.
I am building a website that uses PHP and JavaScript. I have a main menu that dynamically, when I click on a button it loads a page in the content div and runs its JavaScript script.
Now the problem is when I have loaded a JavaScript file and I go to another page that loads its contents in the same content div, the old JavaScript file that was included in the previous page is still loaded. Is there a way to prevent this.
JavaScript code:
$(".button").click(function(){
$("#content").empty();
$("#content").load("PHP/home.php");
});
PHP/home.php code
<html>
<head>
<title>test</title>
<script type="text/javascript">
$(document).ready(run);
function run(){
alert("test");
setTimeout(run, 500);
}
</script>
</head>
<body>
<h1>Homepage</h1>
</body>
the Jquery is loaded in the HTML that the content div is. And all the other buttons and PHP pages is being used the same way. When i load a new page the Alert function of the home.php is still going.
just have a clue because you haven't shown enough code
try clearing out the div with
document.getElementById("content").innerHMTL = "";
then adding other page content in it
I loaded a content into a div using php get_file_contents,
now i want to refresh it using ajax but i can't figure how to do it.
Sample code:
<script>
function refreshmydiv(){
...
}
</script>
<div id="mydiv"> <? echo nl2br(htmlspecialchars($myfile)); ?> <div>
Refresh My Div
So, here is one way of doing it. First, the parts:
myrefreshfunction
This function needs to make an AJAX call to refresh.php or another page. Then, it should replace the contents of mydiv with the html that is sent back.
refresh.php
This page needs to return the HTML for the div. It doesn't need to return the whole page, it only needs to return the contents of the div.
In this case, it would just echo get_file_contents and nothing else.
ex.
<?php
$homepage = file_get_contents('http://www.example.com/');
echo $homepage;
?>
Then, the refresh process looks like this:
Your user presses the button to refresh the div.
Your function requests a page.
The page returns ONLY the contents of the div.
Your function replaces the content of the div with the page it just requested.
There are other ways to do this, put this is a very straightforward way to do it.
If you use jQuery, your myrefreshfunction is basically one line of code:
$('mydiv').load('refresh.php');
If you use the Prototype JavaScript framework you can do it this way:
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript">
function refreshmydiv() {
new Ajax.Request('/ajax/getdivcontents.php', {
method: 'post' ,
onSuccess: function(request) {
$('mydiv').update(request.responseText);
}
});
}
</script>
<div id="mydiv"> <? echo nl2br(htmlspecialchars($myfile)); ?> <div>
Refresh My Div
This will make an Ajax call when you click on the "Refresh My Div" link. The getdivcontents.php page will create the HTML you wish to display.