13 Replies - 633 Views - Last Post: 12 May 2013 - 02:55 AM

#1 efraim  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 05-November 09

Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 03:32 AM

I hope this the right area to ask this.
I have a form on a page that also contains a slideshow with data populated from an xml file.
All I want to do is GET the caption tag of the currently selected image and put it in the form text input.
All my research only shows me how to get an array of all captions from the xml file, not the currently selected caption only.

My js code is
		<script language="Javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200);

xmlhttp.open("GET","gallery.xml",true);
xmlhttp.send();
document.getElementById("caption").innerHTML=xmlhttp.responseText;
}
</script>



and my xml code is
<?xml version="1.0" encoding="UTF-8"?>

<gallery 

	title="Test"
	imagePath="images/"
	thumbPath="thumbs/"
	background-image="URL(echobkgd.jpg)"
	backgroundURL="echobkgd.jpg"
	textColor="FFFFFF"
	frameColor="FFFFFF"
	thumbPosition="LEFT"
	galleryStyle="COMPACT"
	thumbColumns="4"
	thumbRows="4"
	showOpenButton="false"
	showFullscreenButton="false"
	frameWidth="0"
	maxImageWidth="500"
	maxImageHeight="500"
	languageCode=""
	languageList=""
	embedColor="FFFFFF"
	imageDropShadow="true"
	thumbNavStyle="SQUARE"
	titleFontColor="FFFFFF"
	titlePosition="TOP"
	titleTextAlignment="CENTER"
	titleFontSize="24"
	imageNumberFontSize="16"
	floatCaption="true"
	captionBackColor="FFFFFF"
	enableCaptionLinks="true"
	captionPosition="TOP"
	captionHeight="30"
	captionFontColor="000000"
	captiondropShadow="true"

>
  <image imageURL="images/IMG_0001.jpg"
	thumbURL="thumbs/IMG_0001.jpg">
<caption>IMG_0001.jpg</caption>
  </image>
  <image imageURL="images/IMG_0002.jpg"
	thumbURL="thumbs/IMG_0002.jpg">
<caption>IMG_0002.jpg</caption>
  </image>
  <image imageURL="images/IMG_0003.jpg"
	thumbURL="thumbs/IMG_0003.jpg">
<caption>IMG_0003.jpg</caption>
  </image>
  <image imageURL="images/IMG_0004.jpg"
	thumbURL="thumbs/IMG_0004.jpg">
<caption>IMG_0004.jpg</caption>
  </image>
</gallery>



My attempted output to the form is
<script type="javascript">document.write("loadXMLDoc()");</script>


I am asking here because I am not getting a result. I can't figure out why.

Is This A Good Question/Topic? 0
  • +

Replies To: Performing a simple AJAX task proving too difficult

#2 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3224
  • View blog
  • Posts: 10,825
  • Joined: 12-December 12

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 03:57 AM

There is a specific Javascript forum.

<script language="Javascript">

This is obsolete, and should be script type="text/javascript", the same in the following line.

<script type="javascript">document.write("loadXMLDoc()");</script>

document.write should not be used. If you want to call the function just use:

<script type="text/javascript">
    loadXMLDoc();
</script>


But you have a missing bracket in your code. Investigate your browser's console as it will be showing an error message; there are links in my signature.

Gosh, this is wrong:

if (xmlhttp.readyState==4 && xmlhttp.status==200);

and you are not waiting for the ajax request to complete before setting the innerHTML. I think you should start over and study: https://developer.mo...rg/en/docs/AJAX
Was This Post Helpful? 1
  • +
  • -

#3 efraim  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 05-November 09

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 08:16 AM

Thank you for your reply Andrewsw,
I went and read through the tutorial from the link you provided but after trying to implement what it said could still not get it to work. I tried the various options, editing the path details and so on but the problem comes when the last 2 or 3 instructions completely lose me. Sentances like [quote]The code below replaces the textfield form object and the second part replaces the assignment into the Javascript function.[/endquote]
Step by step is rarely that. There are an awful lot of assumptions going on in the authors head. Can't blame them, it must be tedious trying to teach old dogs new tricks but very frustrating when I can see the information I want, I can see where I want to put it, but no-one can tell me just how. Why does everyone want to involve buttons to click on? I just want to duplicate a caption elsewhere.
Thanks anyway.
Was This Post Helpful? 0
  • +
  • -

#4 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3224
  • View blog
  • Posts: 10,825
  • Joined: 12-December 12

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 08:29 AM

Of course, there are many ajax tutorials available, but a good understanding of Javascript is a pre-requisite. Good luck.
Was This Post Helpful? 0
  • +
  • -

#5 efraim  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 05-November 09

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 08:46 AM

Hi,
I forgot to mention that the tutorial files and source code I downloaded, doesn't work either. The 'get-xml-html' file renders an error and all that is trying to do is retreive 'Hello you' so what chance have I got. Also my latest code that still won't work but I think is much nearer to getting there is
<script type="text/javascript">

function getCaption()
{ 
    var xhr; 
    try {  xhr = new ActiveXObject('Msxml2.XMLHTTP');   }
    catch (e) 
    {
        try {   xhr = new ActiveXObject('Microsoft.XMLHTTP');    }
        catch (e2) 
        {
          try {  xhr = new XMLHttpRequest();     }
          catch (e3) {  xhr = false;   }
        }
     }
   
    xhr.onreadystatechange  = function()
    { 
        <span class="Style1"></span>;  // instructions to process the response
    }
    { 
         if(xhr.readyState  == 4)
         {
              if(xhr.status  == 200) 
                  // Assign the XML file to a var
              var doc = xhr.responseXML;
                  // Read the first element
              var element = doc.getElementsByTagName('caption').item(0);  
                  // Assign the content to the form
              document.getElementById("zone").innerHTML = "Received:" + xhr.responseText;
 
              else
                 document.ajax.dyn="Error code " + xhr.status;
         }
    }; 
 
   xhr.open(GET, "gallery.xml",  true); 
   xhr.send(null); 
} 

</script>


Was This Post Helpful? 0
  • +
  • -

#6 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3224
  • View blog
  • Posts: 10,825
  • Joined: 12-December 12

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 08:54 AM

It is nearer. This, however

<span class="Style1"></span>;  // instructions to process the response

is HTML in the middle of JS, which you cannot do.

Most of the code that follows that should be part of the onreadystatechange event-code.

..your second if statements needs following brackets as well.

Learn Javascript first! :dontgetit:
Was This Post Helpful? 0
  • +
  • -

#7 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3712
  • View blog
  • Posts: 5,964
  • Joined: 08-June 10

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 11:11 AM

Thread moved to the Javascript forum.

View Postandrewsw, on 11 May 2013 - 10:57 AM, said:

<script language="Javascript">

This is obsolete, and should be script type="text/javascript"

Technically that's obsolete as well. The <script> tag has defaulted to Javascript for ages in pretty much all browsers, and in HTML5 they made it official, making the type attribute optional.
Was This Post Helpful? 1
  • +
  • -

#8 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3224
  • View blog
  • Posts: 10,825
  • Joined: 12-December 12

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 11:29 AM

View PostAtli, on 11 May 2013 - 06:11 PM, said:

Thread moved to the Javascript forum.

View Postandrewsw, on 11 May 2013 - 10:57 AM, said:

<script language="Javascript">

This is obsolete, and should be script type="text/javascript"

Technically that's obsolete as well. The <script> tag has defaulted to Javascript for ages in pretty much all browsers, and in HTML5 they made it official, making the type attribute optional.

Is HTML5 official?

It's a long process: Wiki

Quote

In September 2012, the W3C proposed a plan to release a stable HTML5 Recommendation by the end of 2014

Was This Post Helpful? 0
  • +
  • -

#9 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3224
  • View blog
  • Posts: 10,825
  • Joined: 12-December 12

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 11:39 AM

@Atli I was aware that the type attribute was optional but am struggling to find this written down anywhere formally. Have you come across a reference? (It's not important, I'm just intrigued :).)

Added: No worries. It passes validation, which is as good a test as we need :)

This post has been edited by andrewsw: 11 May 2013 - 11:46 AM

Was This Post Helpful? 0
  • +
  • -

#10 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3712
  • View blog
  • Posts: 5,964
  • Joined: 08-June 10

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 02:18 PM

It's detailed in the HTML5 CR specification.

I know it's a painfully long process, but at that stage, things like that won't change. Perhaps I should have said "practically" rather than "technically" in my earlier post. It's technically not a part of the final recommendation yet, but practically it has worked like the current HTML5 spec suggests it should for years in all the major browsers.
Was This Post Helpful? 1
  • +
  • -

#11 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3224
  • View blog
  • Posts: 10,825
  • Joined: 12-December 12

Re: Performing a simple AJAX task proving too difficult

Posted 11 May 2013 - 02:29 PM

Thanks @Atli. script alone used to give me a wiggly line in my editor and, as I recall (a while ago now) it wouldn't validate. I'm old school and still use "text/javascript" :) but, for a novice, I suppose the fewer characters they need to (mis)type the better :bigsmile:

This post has been edited by andrewsw: 11 May 2013 - 02:29 PM

Was This Post Helpful? 0
  • +
  • -

#12 efraim  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 05-November 09

Re: Performing a simple AJAX task proving too difficult

Posted 12 May 2013 - 01:10 AM

Thanks fellas for highjacking my thread and arguing amongst yourselves. Not encouraging for a 'novice' who's likely to misspell stuff anyway.

That line containing html is used in exact adherance to the instructions of the tutorial you directed me to. The same place that contained a demonstration file that produces errors, which I notice you didn't comment on. Maybe if you were genuinely more interested in helping than puffing your chest out I might learn something from you.
Was This Post Helpful? 0
  • +
  • -

#13 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3224
  • View blog
  • Posts: 10,825
  • Joined: 12-December 12

Re: Performing a simple AJAX task proving too difficult

Posted 12 May 2013 - 02:51 AM

The MDN documentation and tutorials are very good. I already suggested that there are many other ajax tutorials available so, if you struggle with one, find another that you prefer.

The reason that you are struggling is that you lack fundamental knowledge of Javascript. Quoting myself:

Quote

Of course, there are many ajax tutorials available, but a good understanding of Javascript is a pre-requisite. Good luck.

Was This Post Helpful? 0
  • +
  • -

#14 JackOfAllTrades  Icon User is offline

  • Saucy!
  • member icon

Reputation: 6039
  • View blog
  • Posts: 23,436
  • Joined: 23-August 08

Re: Performing a simple AJAX task proving too difficult

Posted 12 May 2013 - 02:55 AM

Why don't you post a link to this tutorial you're using that's apparently giving you bad information?
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1