Alert on HTTP request - javascript

In jquery one can do an event like this:
$( "#target" ).click(function() {
alert( "Handler for .click() called." );
});
Is it possible to do this when a page is doing a HTTP request to a certain URL? Maybe with plain Javascript?
It shouldent matter what kind of request (ea AJAX or post or whatever)
$( "#target" ).???ON_HTTP_REQUEST???(function() {
alert( "Handler for .click() called." );
});
I Googled a LOT but there is nothing on this.

What you're looking for is probably $.ajaxStart, which fires whenever an ajax call starts up (POST and GET):
$( document ).ajaxStart(function() {
alert("Ajax started");
});
from the docs:
Whenever an Ajax request is about to be sent, jQuery checks whether
there are any other outstanding Ajax requests. If none are in
progress, jQuery triggers the ajaxStart event. Any and all handlers
that have been registered with the .ajaxStart() method are executed at
this time.

$( document ).ajaxSend(function( event, jqxhr, settings ) {
if ( settings.url == "ajax/test.html" ) {
alert( "loading ajax/test.html" );
}
});

Related

how to make sure the page is loading only after the jquery is loaded

I have a jsp page with jquery-ui somehow it's taking time to load .
I have hide the dom and onload function I am writing the following code
setInterval(function(){
if(typeof jQuery.ui !=undefined )
{
$(document.body).css("visibility", "visible");
}
},5000)
I don't want to run the function once condition get true , how to achieve it
Write your all code inside the:
$( document ).ready(function() {
console.log( "ready!" ); //Here you can put all the code
});
Once you DOM(Document object model) is ready then your js code will run, which is written inside the document ready function.
Put your code inside a $( document ).ready() block. As shown below.
$( document ).ready(function() {
console.log( "ready!" );
});
OR shorthand for $( document ).ready()
$(function() {
console.log( "ready!" );
});
You may refer to this documentation for more information. https://learn.jquery.com/using-jquery-core/document-ready/

load external file into page id in jquery mobile

i have an external file profile.php, i want to load it into a sub page id profile after clicking a link.. i have tried the code below but i did not see any been displayed after the click event, the clicked event is triggered because i have tested it alert , there is no error in console i think i'm missing something please help out. thanks
$(document).on("click", "#profilel",function(){
$( ":mobile-pagecontainer" ).pagecontainer( "load", "profile.php" )
});
Try this one
$(document).on("click", "#profile",function(){
$( ":mobile-pagecontainer" ).pagecontainer( "load", "profile.php" )
});
or
$("#profilel").click(function(){
$.get("profile.php")
.done(function(data){
$( ":mobile-pagecontainer" ).html(data);
});
});

JQuery Load Page into Div ... How to access external div with jquery

I am loading a page into a div like this:
<script type="text/javascript">
$(document).ready(function(){
$("#siteloader").html('<object data="http://mysite/form1.php" />');
$( "#myform" ).submit(function( event ) {
alert( "Handler for .submit() called." );
event.preventDefault();
});
});
</script>
I can see with firefox that the page loaded is on a frame.
My question is, how can I access anything on the loaded page with jquery ?
You can try using jQuery .load() to do the same thing but only return the element that you need and not withing a frame. Jquery .load But to answer your question try using the .contents() to get the information you need. jQuery .contents
$('#siteloader').load("mysite/form1.php")
.success(function(){
$( "#myform" ).submit(function( event ) {
alert( "Handler for .submit() called." );
event.preventDefault();
});
})
EDIT: added code

.click event don't work on a certain div ID conflict?

I try to execute a function when I click on a specific div ID and nothing happens, help! Example:
$( "#jwplayer-1_wrapper" ).click(function() {
alert( "Handler Clicked" );
});
-> Full example here <-
Check this
http://jsfiddle.net/2mK7Z/22/
$(document).ready(function(event)
{
$('#jwplayer-1_wrapper').mousedown(function() {
alert('click detetced');
});
});
I think this is the problem you are experiencing: Track a click on a flash movie (object / embed) with jQuery
That is - the embedded flash object steals the click event, and jquery will never see it.
Do you create the element dynamically? It could be that the element doesn't exist at document ready. Try:
$("body").on("click", "#jwplayer-1_wrapper", function() {
alert("Handler clicked");
})
Otherwise, check the ID and make sure it's correct.
You have to wait for the DOM to become ready. Use jQuery(document).ready
$(document).ready(function() {
$( "#jwplayer-1_wrapper" ).click(function() {
alert( "Handler Clicked" );
});
});

wrapping a function as a jQuery parameter

i am buliding an autocomplete for my website when i came across this style of building code:
$(function() {
function log( message ) {
$( "<div/>" ).text( message ).prependTo( "#log" );
$( "#log" ).scrollTop( 0 );
}
$(element).autocomplete(....
//more code
});
i know about closures, "IIFE"s but this one's a new one for me.
what's with the "jQuery-wrapped" code above?
is there any particular reason i should do that? (scope?)
optimization-wise, should i even do it that way?
$(function() { }); is equivalent to $(document).ready(function() {}); and as before it executes once the DOM has been ready.
Defining a function inside is to tell that, the function is only available once the dom is ready to execute.
$(element).autocomplete(.... is simply implementing the plugin to the selector, once the DOM is ready to execute.
Hope its clear now :)
$(function() { or $(document).ready(function() { does not need the whole page to load, to run as $(window).load(fn) does.
$(fn) or $(document).ready(fn) Is jQuery's onload/onDOMContentLoaded handler. The function passed to it is executed once the DOM on the page is ready.
Everything in $(function() { } will be executed after the DOM has loaded. I prefer to use
$(document).ready(function() { } because it is more clear.

Categories