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.
Related
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.
I am using an external javascript file to call a function and it will not. i get function not defined in firebug too.
the name of the external js file is getpic.js
in the html, i put this in the header:
<script src="getpic.js" type="text/javascript">
</script>
php:
echo "<button id='sldkfj' onclick='hg();'>sdlkfj</button>";
js:
function hg()
{
alert("hello")
}
the file system is basically in one folder for wamp
this is all of getpic.js
function hg()
{
alert("hello")
}
for the php part
<html>
<head>
<script src="getpic.js" type="text/javascript">
</script>
</head>
<body>
<?php
echo "<button id='sldkfj' onclick='hg();'>sdlkfj</button>";
?>
EDIT-----
i also keep getting this in firebug:
Reload the page to get source for: http://localhost/iframe/getpic.js
Thanks
Edit:
add the code segment to the html page as a
<script type="text/javascript">
function hg()
{
alert("hello");
}
</script>
if still it doesnt work there should be something wrong with the browser.
(disabled java script) try a different browser
if it works,
obviously there's an error in linking the file.
on firebug go to the script panel and see whether it is loaded or not. (you can also use net panel as well)
try linking
<script src="/getpic.js" type="text/javascript">
if you are at the localhost(www) directory or the absolute path
<script src="/mytest/getpic.js" type="text/javascript">
add ; at the end of the alert() command
function hg()
{
alert("hello");
}
Try taking the script tag out of the head element and put it in the body. I've had this problem before and that's what fixed it for me.
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 want to trigger javascript alert using PHP.
Is it possible
I want to use it in head section, for displaying it at load time.
<head>
<?php
$valid="valid";
if(!isset($valid))
echo "<script type=\"text/javascript\"> alert('Hi');</script>";
?>
</head>
EDIT
i want to display javascript alert() at load time after checking existance of session
Of course this is possible.
All you are doing is outputting JavaScript, it's all the same thing.
The only issue is that you are nesting <script> tags, which is an HTML error, so get rid of the tags in the echo string.
<script type="text/javascript">
<?php
$valid="valid";
if(!isset($valid))
echo "alert('Hi');";
?>
</script>
By the way, as i'm sure you already know, this specific code will ALWAYS echo the "alert('Hi');"
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.