PDA

View Full Version : Ajax and JS don't get along?



tivaelydoc
12-30-2008, 07:52 AM
1) Script Title:
Dynamic Ajax Content
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm
3) Describe problem:

I have this js text generator:

http://tivaelydoc.110mb.com/java4.html

I want it to load in the main content window of this layout (first test button):

http://tivaelydoc.110mb.com/BI6.html

I even trying loading the js separately, which is the second test button, using this:

http://tivaelydoc.110mb.com/feature.js

but it still didn't work. How come?

Nile
12-30-2008, 08:14 AM
Please update the sentence generator to the most recent code I posted.

jscheuer1
12-30-2008, 08:17 AM
You need to remove:


<script type="text/javascript">


and:


</script>

from the feature.js file.

There could also be other problems. However, since you will be using the script anyway, no need to load it. Just put it on the 'top' page (BI6.html).

tivaelydoc
12-30-2008, 10:50 AM
Thanks, I updated it. Do you know how I would get rid of the spelling correction underlines?

http://tivaelydoc.110mb.com/BI6.html

Look at Macey.

I know it's a browser feature, but it doesn't show up in the original link:

http://tivaelydoc.110mb.com/java4.html

Can I PM someone my website to look at? I'm having trouble loading js files.

jscheuer1
12-30-2008, 04:08 PM
I cannot see anything that immediately differentiates the two textareas as served. I'm more surprised that spell check is off in the stand alone version than by the fact that it is on in the imported one. The correct spelling (according to the browser's dictionary) could be used though:

MACY

Nile
12-30-2008, 04:18 PM
Yes, or you could switch that textarea to a div.

tivaelydoc
12-30-2008, 10:51 PM
What would I have to do to switch it to a div?

Nile
12-30-2008, 10:55 PM
Change:


<textarea id="text" name="text" style="background:black;width:100%;height:150px;font-size:2em;font-family:garamond;color:#990000;text-transform: uppercase;"></textarea>

To:


<div id="text" name="text" style="background:black;width:100%;height:150px;font-size:2em;font-family:garamond;color:#990000;text-transform: uppercase;"></div>


And switch:


el = document.getElementById(el).value = random;

To:


el = document.getElementById(el).firstChild.nodeValue = random;

tivaelydoc
12-31-2008, 03:09 AM
Here is the link:

http://tivaelydoc.110mb.com/BI8.html

Flash works, but comments don't show up if you click on it twice. The words don't sort, but the main link works. And the HTML generator doesn't work period.

Nile
12-31-2008, 03:13 AM
I don't see where you calling the function...

tivaelydoc
12-31-2008, 03:30 AM
Which function? Because I took out the javascript from java 3 and put it in BI8.

Nile
12-31-2008, 04:05 AM
The:

<input type="button" onclick="setRandom(violence,12,'text');" value="Social" />

tivaelydoc
12-31-2008, 04:37 AM
From:

http://tivaelydoc.110mb.com/BI/java3.html

I moved the script from that link to this link because ajax sucks:

http://tivaelydoc.110mb.com/BI8.html

But if you look at this:

http://tivaelydoc.110mb.com/BI9.html

The HTML works fine. Why is that?

Nile
12-31-2008, 04:41 AM
Ok... Confused...

See what you mean, lemme take a look.

Nile
12-31-2008, 04:51 AM
Why don't you just use your 2nd example and be done with it?

tivaelydoc
12-31-2008, 07:59 AM
Well, I was trying to get rid of the spellcheck underlines by switching over to div instead of textarea.

Second, the comment and word sections don't work.

EDIT: Got the word section to work. So I figured out that ajax and js don't work together at all and php would probably be a better solution, but if I just post the JS on the main page instead of calling for it via link, then it works. Except for the comments...

Screw ajax. It doesn't work period with JS. Is there something better that's not complicated?

I'm sorry if some of the words in here are explicit, I'm on a very short time span, but if you look here, you'll notice that they sort:

http://tivaelydoc.110mb.com/BI/list.html

Even when I take out the links for the 3 JS at the top and replace them with the actual code, they still sort:

http://tivaelydoc.110mb.com/BI/list2.html

This generator only works, on it's own, with the JS in the file:

http://tivaelydoc.110mb.com/BI/java5.html

But, if I take the JS out of that file and put it in the main html page, it still works (click on Words):

http://tivaelydoc.110mb.com/BI9.html

But when I put the 3 JS files for the table sorting in the main html, it still doesn't sort.
Second, the comment system will not work period. Is there one that's recommended for ajax or is there something better than ajax that I should switch over to?

jscheuer1
12-31-2008, 04:22 PM
For something like this - iframe, though deprecated in HTML 4.01 strict and above might be easier. Your idea to use PHP (if done well) would be probably the easiest valid alternative solution for the long term. But PHP brings with it page reloads. This is what both iframe and AJAX are each intended to (at least in part) avoid. As a note, AJAX is in part meant as a valid alternative, going forward, to iframe. One thing to consider though with both iframe and PHP is, if the scripts aren't on the top page to begin with, there will still be a loading hit from them the first time their associated content and they are served, so in that regard they are no different than AJAX.

It's too bad you feel a time constraint on this. AJAX can be made to work, it just may take some time to sort that and any other changes you are contemplating with this code out, especially here on a free forum where the members are all donating their time.

One other thing, AJAX is javascript + server requests. So it isn't a matter of the AJAX and JS getting along, but a matter of writing the code in a way that works.

tivaelydoc
01-01-2009, 02:22 AM
Is there a general fix for JS within ajax?

jscheuer1
01-02-2009, 06:09 AM
Is there a general fix for JS within ajax?

Not really. And this thread is being compromised to a degree (at least from my perspective) because it is also focusing on a proposed change to div from textarea that I haven't yet signed off on.

Leaving that aside for the moment, there are three basic choices (as far as I know) as regards AJAX and the scripts one might want to associate with its imported content:


Rewrite the code so that the script(s) listen to the page for activation, rather than initialize content onload.

Poll the new content as it is being added to determine the optimal time to initialize it, and then doing so.

Hard coding the necessary events to the imported content's elements so that they are ready to go once imported.


All three of these approaches require that the scripts be (as I've already mentioned) on the 'top' page.

That can be done by either hard coding them there in one way or another, or importing them. The latter method tends to be unacceptable if these script(s') byte load (as appears to be the case here) is large.