<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js">
<script type="text/javascript">
$(document).ready(function() {
$.post("ajax.php", function(data) {
alert("Data Loaded");
});
});
</script>
I understand that this code does nothing useful, but why does nothing happen? The php doesn't run, and the alert doesn't show.
Your first SCRIPT element is missing its closing tag </script>, which leads to the whole code being just ignored.
Related
In my parent.htm there's a dropdown list, which is filled dynamically from the database using a JQuery function updateMyList() in parent.js.
If the user wants to add another option to the list, the form child.htm is loaded inside <div id="overlay"> of the parent.htm. To insert new data an AJAX request is called from child.js, which is included in child.htm.
If the request was successful, child.htm is unloaded via $("#overlay").html("") from child.js. When this happens, i'd like to call parent.js's updateMyList(), but i can't find a way to trigger it.
Using opener from inside child.js didn't work (TypeError: opener is null) and i can't find a way to tell if $("#overlay").html() has been changed back to "".
Any help would be greatly appreciated!
Sorry if this is a double post, i'm running out of ideas for search terms...
edit: here's a simplified code:
parent.htm:
<head>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="parent.js"></script>
<script>
$(document).ready(function () {
$('#new-option').click(function(){
$("#overlay").load("child.htm");
});
});
</script>
</head>
parent.js:
$(document).ready(function(){
function updateMyList(){
//send AJAX and write options
});
// and do much more...
});
child.htm:
<head>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="js/child.js"></script>
</head>
child.js:
$(document).ready(function(){
// do more stuff
$('#save-option').click(function(){
$.post("./inc/savenewoption.php", {
//save user entries
}, function(data){
alert(data);
})
.done(function() {
updateMyList(); // <- this won't work
$("#overlay").html("");
});
});
});
It doesn't work because updateMyList() is inside a different function (one of your $(document).ready() ones). In my experience the only reason you put code into a $(document).ready() function is because Javascript can fire before the document has completely loaded. Trying to fire Javascript on elements before they are in the document will cause errors.
The updateMyList() function doesn't fire until the ajax request is complete, so it should be safe to have it located outside $(document).ready().
The code below runs fine on my first PHP file, but when I load another file and use the same script, it does not appear to work, I get no alert from alert (idstate);. The CSS/HTML works fine.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("li").click(function(){
if (event.target.id!=""){
var idstate=(event.target.id)
alert (idstate);
$.post( "somepage.php", { variable: idstate}, function(data)
{
alert(data);
});
}
});
});
</script>
when You load another file you have to link that with your php page.<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
<script src="path/custom.js"></script>
there is a script I'm trying to use for Blogger. It works when you enter your domain URL into the src, but I'm trying to find a way to do it using hostname to insert the domain.
Original script:
<script type="text/javascript" src="http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=INSERT-YOUR-URL-HERE&ShowHowMany=5&_id=390e906036f48772b2ed4b5d837af4cd&_callback=getYpipePP&_render=json" />
I tried:
<script type="text/javascript">
var excuteTopCommentators = "http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=http://'+window.location.hostname+'&ShowHowMany=5&_id=390e906036f48772b2ed4b5d837af4cd&_callback=getYpipePP&_render=json"
return excuteTopCommentators
</script>
I also tried document.write:
<script type="text/javascript">
document.write('<script type="text/javascript" src="http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=http://'+window.location.hostname+'&ShowHowMany=5&_id=390e906036f48772b2ed4b5d837af4cd&_callback=getYpipePP&_render=json"></script>');
</script>
Neither of the attempts seem to work. Any ideas on how to do this without manually inserting the domain URL into the script src?
Perhaps the problem is that you get the script, but it is never executed.
Maybe try jQuery's getScript http://api.jquery.com/jquery.getscript/
function getIt() {
return $.getScript('http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=http://'+window.location.hostname+'&ShowHowMany=5&_id=390e906036f48772b2ed4b5d837af4cd&_callback=getYpipePP&_render=json');
}
Your second option looks fine:
<script type="text/javascript">
document.write('<script type="text/javascript" src="http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=http://'+window.location.hostname+'&ShowHowMany=5&_id=390e906036f48772b2ed4b5d837af4cd&_callback=getYpipePP&_render=json"></script>');
</script>
The script is downloaded but do nothing. this is because it is a JSONP, not an script
So, you need a callback function to get it working: (note that is data, not code)
<script type="text/javascript">
// JSONP Callback
function getYpipePP(data) {
alert(JSON.stringify(data));
}
document.write('<script type="text/javascript" src="http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=http://'+window.location.hostname+'&ShowHowMany=5&_id=390e906036f48772b2ed4b5d837af4cd&_callback=getYpipePP&_render=json"></script>');
</script>
http://plnkr.co/edit/HhYZtH09EcdPZbwS9rfq?p=preview
Look the query, say _callback=getYpipePP and _render=json
Related: What is JSONP all about?
Try this (the problem you're having is the end "script" tag):
<script type="text/javascript">
document.write('<script language="javascript" src="http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=http://'
+ window.location.hostname
+ '&ShowHowMany=5&_id=390e906036f48772b2ed4b5d837af4cd&_callback=getYpipePP&_render=json" type="text/javascript"><\/script>')
</script>
<script>
function showAlert(){
alert('Bazinga')
}
$(document).ready(function(){
showAlert();
});
</script>
In my example I first of all declaring function and else calling this function when documents is loaded. But alert is now show.
Make sure you have included jQuery library , The script should be after the jQuery library.
<script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
<script>
function showAlert(){
alert('Bazinga');
}
$(document).ready(function(){
showAlert();
});
</script>
Fiddle
I think you forgot the ";" on alert, try adding ";". If that does not do the trick you could try move up ur document ready.
i'm trying this code:
<script type="text/javascript">
$('#ooo').click( function() {
alert("jadner");
});
<script>
prueba
I expected it shows the alert when i click on "prueba", but it doesn't show anything..
Regards
Javi
You need to bind the event only after the DOM finishes loading. Wrap your code inside $(document).load() event like this:
<script type="text/javascript">
$(document).ready(function() {
$('#ooo').click(function() {
alert("jadner");
});
});
</script>
1 - Make sure jQuery has been included.
2 - Make sure your click handler is in a $(document).ready(function() {...}); block.
See:
http://docs.jquery.com/Tutorials:Introducing_$(document).ready()
You have to either reverse the order of the tags, i.e. put the script after the link:
prueba
<script type="text/javascript">...</script>
or wrap the code in a $(document).ready() callback:
$(document).ready(function(){
$('#ooo').click( function() {
alert("jadner");
});
});
The problem: When your JS is executed, it tries to find the element with ID ooo which does not exist yet. Parsing is always from top to bottom. So the script gets executed before the link element is created.
Add return false; below the alert. and like Nanne says, make sure you've got jQuery loaded properly
should be </script> not <script>
use document.ready()
<script type="text/javascript">
$(document).ready(function(){
$('#ooo').click( function() {
alert("jadner");
});
});
</script>
prueba
Try the following code.
<script src="http://code.jquery.com/jquery-1.4.4.js"></script>
<script language="javascript">
$(function()
{
$('#ooo').click( function()
{
alert("jadner");
});
});
</script>
prueba