how can I get plain text assigned through innerHTML to work as real Javascript? Should I use eval()?

[Jake Barnes]

I'm helping to build a site where people recovering from addiction are
suppose to able to share their stories with each other, and encourage
each other toward greater sobriety. One idea that the client had was a
"Sharing Wall" where the posts fade in and fade out and are
constantly replaced. This was suppose to be achieved through Ajax. If
people don't have Javascript on, then they simply read the first 6
posts which appear on the front of the site. But if Javascript is on,
then every 20 seconds each of 6 posts gets updated. You can get a
sense of the front page here:

http://www.bluewalldev.com/secondroad/index.php

The site is still quite rough. The designer is working on it right
now, so things might be crazy when you look at it.

For my part, I'm using the Prototype library to make calls against
this page:

http://www.bluewalldev.com/secondroad/api.php?choiceMade[]=showRandomCommunityPost

Hit refresh on that page a few times. You'll see it serves a different
post each time.

Here is my problem. Prototype fetches text and assigns it using
innerHTML. The text I'm fetching contains Javascript. Is there any
easy way to bring this Javascript to life? Perhaps using eval()?

Is there any easy way to turn text into elements that belong to the
DOM?

I'm normally comfortable building new elements to a page using DOM
friendly methods, but in this case, I can't think how to get this
information from the database and wrap it in HTML and Javascript in a
way that doesn't simply kill performance.

I suppose I could try to fetch the needed info as XML, but it seems
like it would be an amazing amount of work to turn that XML into the
HTML and Javascript that one sees on this page.

Any suggestions?

 

[Jake Barnes]

Jake Barnes said the following on 9/8/2007 11:02 PM:


The main source of your problem is in not designing the back-end to be
Ajax ready. Your first step should be to correct the script errors on
the main page.

I'm confused by your reference to script errors. There are no errors
on the page, save for the errors produced by the question that I am
here raising. If there were no errors, then I would not be posting to
comp.lang.javascript. But I'm not aware of any errors, aside from the
one that I'm here asking about.

Along with the script errors?

Well, I'm asking how to fix those errors. Those errors occur because
the inline Javascript is not being read as Javascript once Prototype
fetches the text and assigns it to innerHTML.

The site is still quite rough. The designer is working on it right
now, so things might be crazy when you look at it.

For my part, I'm using the Prototype library to make calls against
this page:

http://www.bluewalldev.com/secondroad/api.php?choiceMade[]=showRandomCommunityPost

Hit refresh on that page a few times. You'll see it serves a different
post each time.

I got the same post 3 times in a row. Not many posts yet?

Myself and the client typed in about 20 posts so we'd have some sample
text to work with. So, yes, with 6 posts appearing at a time, the
chance for overlap is large. Later this week I'll be altering the PHP
code so that the id for each currently showing post is stored in the
$_SESSION variable, and that information will be used to foreclude
repeats. But I'd like first to get the Javascript working right.

The simplest way to fix your particular problem is going to be to assign
the onmouseover and onmouseout using script, put that script in a script
block and then get that script block executed. Once you have your script
in script blocks instead of the HTML code, try this thread and the links
in it:

<URL:http://groups.google.com/group/comp.lang.javascript/browse_frm/thread...>

Thanks much for the tip.

Assuming I instead decide to fetch the data as XML and transform it
using DOM friendly methods, do you have a link you'd like to share
regarding easy XML to DOM transitions?

 

[Bill H]

Jake Barnes said the following on 9/9/2007 5:03 PM:







The errors generated by Firefox are numerous and all fall into a simple
category:

document.getElementById('...') has no properties.

Same error on IE 7 shows up when you mouse over the "sharing wall"

Bill H

 

[Jake Barnes]

Jake Barnes said the following on 9/9/2007 5:03 PM:





The errors generated by Firefox are numerous and all fall into a simple
category:

document.getElementById('...') has no properties.

Which implies you are trying to alter an element that doesn't exist.

What element it refers to depends on which entry I mouse over. That
indicates your event handlers are being processed, your code just refers
to the wrong element.

You're right, the event handlers are being processed. The HTML that
should be there is not there. I was so certain that I knew what the
problem was, I went on a wild goose chase. I see now the problem
arises from a slight change I made to the PHP code, when you're not
logged in, a certain DIV never appears, and since I wasn't including
the PHP session info in the Ajax call, a visitor to the site was never
logged in, as far as those Ajax calls were concerned.

Thanks much.