jquery ajax doesn't see javascript

[SM]

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:

....
$.ajax({
url: "includes/content.php",
data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),

success: function(data) {
$('#wrapper').removeClass("loading");
$('#content').html(data).fadeIn(400);
}
});
....



After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:

inside php file:
<a class="btn_play">Play</a>


javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
event.preventDefault();

// get the A tag ref
var file = $(this).attr('href');

alert(file);
});

The same <a> tag also exists on the left panel and triggers correctly.
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.

I'm sure this is come out already, but i can't find the solution.

Any hints?

Thanks
Marco

 

[David Mark]

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:

...
$.ajax({
   url: "includes/content.php",
   data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),

   success: function(data) {
      $('#wrapper').removeClass("loading");
      $('#content').html(data).fadeIn(400);
   }});

...

After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:

inside php file:
<a class="btn_play">Play</a>

javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
   event.preventDefault();

   // get the A tag ref
   var file = $(this).attr('href');

   alert(file);

});

The same <a> tag also exists on the left panel and triggers correctly.
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.

I'm sure this is come out already, but i can't find the solution.

Any hints?

Yes. Stop using jQuery. Then you will find that you have to learn (a
lot) before you can script browsers. I know you don't want to hear
that, but it's reality. There are no magic scripts that can turn you
into a JS programmer overnight. This is particularly true of scripts
written by overconfident neophytes (e.g. jQuery).

 

[SAM]

Le 6/11/10 7:01 AM, SM a écrit :

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:

...
$.ajax({
url: "includes/content.php",
data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),

success: function(data) {
$('#wrapper').removeClass("loading");
$('#content').html(data).fadeIn(400);
}
});
...



After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:

inside php file:
<a class="btn_play">Play</a>


javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
event.preventDefault();

// get the A tag ref
var file = $(this).attr('href');

alert(file);
});

I don't know at all jquery ...

try in address bar
javascript:$('a[class=btn_play]').style.color='red';alert($('a[class=btn_play]').href)

if jquery finds the link it will be in red
if the link has an href you'll get a message with this href
and, if not, I hope you'll get 'undefined'

if no link(s) found --> nothing firing or error

The same <a> tag also exists on the left panel and triggers correctly.
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.

As that link on has no href, what do you expect to get ?
Then ... how do you reach the one or the other using :
$('a[class=btn_play]')
does that return a collection of all A with class btn_play ?
if yes, how do you catch one of them ?

I'm sure this is come out already, but i can't find the solution.

function sayMe () {
if(this.href) alert(this.href);
else alert('no href !');
return false;
}
function triggerPlays() {
var play_btns = $('a[class=btn_play]'), n = play_btns.length;
if(n && n.length>0)
while(n--) play_btns[n].onclick = sayMe;
else play_btns.onclick = sayMe;
}

 

[SM]

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:

...
$.ajax({
   url: "includes/content.php",
   data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),

   success: function(data) {
      $('#wrapper').removeClass("loading");
      $('#content').html(data).fadeIn(400);
   }});

After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:

inside php file:
<a class="btn_play">Play</a>

javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
   event.preventDefault();

   // get the A tag ref
   var file = $(this).attr('href');

   alert(file);

The same <a> tag also exists on the left panel and triggers correctly.
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.

I'm sure this is come out already, but i can't find the solution.

Any hints?

Yes.  Stop using jQuery.  Then you will find that you have to learn (a
lot) before you can script browsers.  I know you don't want to hear
that, but it's reality.  There are no magic scripts that can turn you
into a JS programmer overnight.  This is particularly true of scripts
written by overconfident neophytes (e.g. jQuery).

My mistake... wrong forum to write this post.

 

[SM]

Le 6/11/10 7:01 AM, SM a écrit :

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:

...
$.ajax({
   url: "includes/content.php",
   data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),

   success: function(data) {
      $('#wrapper').removeClass("loading");
      $('#content').html(data).fadeIn(400);
   }
});
...

After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:

inside php file:
<a class="btn_play">Play</a>

javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
   event.preventDefault();

   // get the A tag ref
   var file = $(this).attr('href');

   alert(file);
});

I don't know at all jquery ...

try in address bar
javascript:$('a[class=btn_play]').style.color='red';alert($('a[class=btn_play]').href)

if jquery finds the link it will be in red
if the link has an href you'll get a message with this href
and, if not, I hope you'll get 'undefined'

if no link(s) found --> nothing firing or error

The same <a> tag also exists on the left panel and triggers correctly.
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.

As that link on has no href, what do you expect to get ?
Then ... how do you reach the one or the other using :
    $('a[class=btn_play]')
does that return a collection of all A with class btn_play ?
if yes, how do you catch one of them ?

I'm sure this is come out already, but i can't find the solution.

function sayMe () {
if(this.href) alert(this.href);
else alert('no href !');
return false;}

function triggerPlays() {
var play_btns = $('a[class=btn_play]'), n = play_btns.length;
if(n && n.length>0)
while(n--) play_btns[n].onclick = sayMe;
else play_btns.onclick = sayMe;

}

it works! ...

 

[Thomas 'PointedEars' Lahn]

function sayMe () {
if(this.href) alert(this.href);
else alert('no href !');
return false;}

function triggerPlays() {
var play_btns = $('a[class=btn_play]'), n = play_btns.length;
if(n && n.length>0)
while(n--) play_btns[n].onclick = sayMe;
else play_btns.onclick = sayMe;

}

it works! ...

It is still a bad idea, because you could have easily done without the loop
and 20K+ of jQuery needed for $(), thanks to built-in event bubbling:

document.body.onclick = function (e) {
if (!e)
{
e = window.event;
}

if (e)
{
var t = e.target || e.srcElement;
if (t && t.tagName.toUpperCase() == "A" && t.className == "btn_play")
{
window.alert(t.href || "no href");
}
}
};

(or wrappers that do more feature testing and prefer the standards-compliant
approach of adding the event listener)


PointedEars

 

[Thomas 'PointedEars' Lahn]

function sayMe () {
if(this.href) alert(this.href);
else alert('no href !');
return false;}

function triggerPlays() {
var play_btns = $('a[class=btn_play]'), n = play_btns.length;
if(n && n.length>0)
while(n--) play_btns[n].onclick = sayMe;
else play_btns.onclick = sayMe;

}

it works! ...

It is still a bad idea, because you could have easily done without the
loop and 20K+ of jQuery needed for $(), thanks to built-in event bubbling:

document.body.onclick = function (e) {
if (!e)
{
e = window.event;
}

if (e)
{
var t = e.target || e.srcElement;
if (t && t.tagName.toUpperCase() == "A" && t.className ==
"btn_play")
{
window.alert(t.href || "no href");
}

I forgot the `return false' above, so insert here

if (typeof e.returnValue != "undefined")
{
e.returnValue = false;
}

if (/^\s*(function|object)\s*$/.test(typeof e.preventDefault)
&& e.preventDefault != null)
{
e.preventDefault();
}

(or statements to that effect)

}
};

(or wrappers that do more feature testing and prefer the
standards-compliant approach of adding the event listener)

PointedEars

 

[David Mark]

function sayMe () {
if(this.href) alert(this.href);
else alert('no href !');
return false;}
function triggerPlays() {
var play_btns = $('a[class=btn_play]'), n = play_btns.length;
if(n && n.length>0)
while(n--) play_btns[n].onclick = sayMe;
else play_btns.onclick = sayMe;
}

it works! ...

It is still a bad idea, because you could have easily done without the loop
and 20K+ of jQuery needed for $(), thanks to built-in event bubbling:

You mean 70K+. They claim 20K "compressed" for the "production"
version. Of course, that's not the size of the file that you put on
your server. The server may or may not zip it per request; but
regardless, it is decidedly inconvenient to try to compare zipped
sizes with other (normally unzipped) assets. In general, disingenuous
marketing has made it awkward to talk about the relative sizes of Web
page assets. Dojo likes to talk about "over the wire" sizes. That's
there way of saying they aren't going to tell you the size that
matters, but rather a number that makes their scripts sound smaller
(e.g. in comparison to HTML documents that sit next to them on the
server).

 

[David Mark]

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:
...
$.ajax({
   url: "includes/content.php",
   data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),
   success: function(data) {
      $('#wrapper').removeClass("loading");
      $('#content').html(data).fadeIn(400);
   }});
...
After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:
inside php file:
<a class="btn_play">Play</a>
javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
   event.preventDefault();
   // get the A tag ref
   var file = $(this).attr('href');
   alert(file);
});
The same <a> tag also exists on the left panel and triggers correctly..
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.
I'm sure this is come out already, but i can't find the solution.
Any hints?

Yes.  Stop using jQuery.  Then you will find that you have to learn(a
lot) before you can script browsers.  I know you don't want to hear
that, but it's reality.  There are no magic scripts that can turn you
into a JS programmer overnight.  This is particularly true of scripts
written by overconfident neophytes (e.g. jQuery).

My mistake... wrong forum to write this post.

No, it was the right forum to write this post. You have a shot at
learning something here. If you had posted it to StackOverflow or the
jQuery forum, you would have gotten a bunch of "try this" responses
from jQuery fans (and likely without a discouraging word about using a
dubious 70K script to do what you could accomplish in ten lines of
code). Programming and blind devotion just don't mix.

 

[Thomas 'PointedEars' Lahn]

Thomas 'PointedEars' Lahn:

It is still a bad idea, because you could have easily done without the
loop and 20K+ of jQuery needed for $(), thanks to built-in event
bubbling:

You mean 70K+
ACK

They claim 20K "compressed" for the "production" version. [...]

Last I checked, they claimed "24K", but given the real figure it does make
much of a difference.


PointedEars

 

[David Mark]

Thomas 'PointedEars' Lahn:

You mean 70K+
ACK

They claim 20K "compressed" for the "production" version.  [...]

Last I checked, they claimed "24K", but given the real figure it does make
much of a difference.

Typo. Meant to write 20K+.

 

[SM]

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:
...
$.ajax({
   url: "includes/content.php",
   data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),
   success: function(data) {
      $('#wrapper').removeClass("loading");
      $('#content').html(data).fadeIn(400);
   }});
...
After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:
inside php file:
<a class="btn_play">Play</a>
javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
   event.preventDefault();
   // get the A tag ref
   var file = $(this).attr('href');
   alert(file);
});
The same <a> tag also exists on the left panel and triggers correctly.
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.
I'm sure this is come out already, but i can't find the solution.
Any hints?
Yes.  Stop using jQuery.  Then you will find that you have to learn (a
lot) before you can script browsers.  I know you don't want to hear
that, but it's reality.  There are no magic scripts that can turn you
into a JS programmer overnight.  This is particularly true of scripts
written by overconfident neophytes (e.g. jQuery).

My mistake... wrong forum to write this post.

No, it was the right forum to write this post.  You have a shot at
learning something here.  If you had posted it to StackOverflow or the
jQuery forum, you would have gotten a bunch of "try this" responses
from jQuery fans (and likely without a discouraging word about using a
dubious 70K script to do what you could accomplish in ten lines of
code).  Programming and blind devotion just don't mix.  

My question was simple and the answer has nothing to do with it. I'm a
programmer and i know my stuff. Obviously, I'm not going to use a
library for 10 lines of code... who would actually do that? I use a
library mostly for simple and clean effects and for ajax... that is
more then 10 lines of code. I don't like the fact that my post was use
to turn it into a discussion on libraries... talk about blind devotion!

 

[David Mark]

Using the selection on the left panel, I load the results on the right
panel using jQuery Ajax. So far it's working really good:
...
$.ajax({
   url: "includes/content.php",
   data: "letter=" + letter.substr(letter.lastIndexOf("=") + 1),
   success: function(data) {
      $('#wrapper').removeClass("loading");
      $('#content').html(data).fadeIn(400);
   }});
...
After the results are loaded on the right panel, I click on an <a> tag
that is suppose to trigger some javascript but doesn't:
inside php file:
<a class="btn_play">Play</a>
javasscript to trigger:
$('a[class=btn_play]').click(function(event) {
   event.preventDefault();
   // get the A tag ref
   var file = $(this).attr('href');
   alert(file);
});
The same <a> tag also exists on the left panel and triggers correctly.
But, on the right panel, it doesn't trigger at all! I believe it's
because it doesn't see the javascript.
I'm sure this is come out already, but i can't find the solution.
Any hints?
Yes.  Stop using jQuery.  Then you will find that you have to learn (a
lot) before you can script browsers.  I know you don't want to hear
that, but it's reality.  There are no magic scripts that can turnyou
into a JS programmer overnight.  This is particularly true of scripts
written by overconfident neophytes (e.g. jQuery).
My mistake... wrong forum to write this post.

No, it was the right forum to write this post.  You have a shot at
learning something here.  If you had posted it to StackOverflow or the
jQuery forum, you would have gotten a bunch of "try this" responses
from jQuery fans (and likely without a discouraging word about using a
dubious 70K script to do what you could accomplish in ten lines of
code).  Programming and blind devotion just don't mix.  

My question was simple and the answer has nothing to do with it.

The answer had nothing to do with what?

I'm a
programmer and i know my stuff.

Apparently not enough to eschew jQuery. No crime of course. Just
learn the lesson.

Obviously, I'm not going to use a
library for 10 lines of code... who would actually do that?
Loads.

I use a
library mostly for simple and clean effects and for ajax...

jQuery has awful effects and basic Ajax is another one of those ten
lines of code deals.

that is
more then 10 lines of code.
So?

I don't like the fact that my post was use
to turn it into a discussion on libraries...

Here's the thing, it's not "your post". It's a discussion thread.

....talk about blind devotion!

What does that mean? You brought up jQuery and it was warned against
(for the benefit of all readers). You don't own your posts and it is
fairly clueless behavior to whine about the resulting discussions.
Just go away if you have lost interest.

 

[Tim Streater]

My question was simple and the answer has nothing to do with it. I'm a
programmer and i know my stuff. Obviously, I'm not going to use a
library for 10 lines of code... who would actually do that? I use a
library mostly for simple and clean effects and for ajax... that is
more then 10 lines of code. I don't like the fact that my post was use
to turn it into a discussion on libraries... talk about blind devotion!

My ajax function is 28 lines long, and 11 of those are whitespace (I
find stuff more readable if it's spread out more; YMMV). It has three
args - 1) the name of the PHP module to run, 2) data for that module, 3)
name of the callback function. I'm not sure what else is needed.

I really don't see the point of using a library.

 

[SAM]

Le 6/11/10 11:06 PM, SM a écrit :

My question was simple and the answer has nothing to do with it. I'm a
programmer and i know my stuff.

So I do not understand you could not find the solution
or, at least, see you had more than one alone and same element.

I used only the jquery $() function without its babies to try to fix the
problem and hope you found something shorter in that lib to correct
that. There is certainly something treating the case collections-or-not

Obviously, I'm not going to use a library for 10 lines of code...

The use of those lybraries push to forget his JS and probably to think,
it seems.

I use a library mostly for simple and clean effects and for ajax...
that is more then 10 lines of code.

not so far from 10 or 20 lines (Ajax)

then, if you really need "effects" ...
.... are they well accepted by the visitors ?

I don't like the fact that my post was use
to turn it into a discussion on libraries... talk about blind devotion!

You can't ask to do not participate, regardless of the interests of the
poster. (whom some advices are not so useless)

I loved the listering approach, didn't you ?