Results 1 to 5 of 5

Thread: "return false" not functioning properly from ajax example

  1. #1
    Join Date
    May 2006
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default "return false" not functioning properly from ajax example

    *Bangs head on keyboard*

    This is in regards to the example Basic Ajax Routine (get & post).

    This is the code on my website:

    (fixed)

    I copied the code exactly as shown and it's not working. I even tried copying and pasting the entire example page from the first link and it still isn't working.

    I've concluded that it has nothing to do with the html. I tried copying the same .js source used on the page as well so I've concluded that it's not the js.

    Could it be the php? I must be overlooking something very simple. But what is it?
    Last edited by Mistrel; 05-17-2006 at 09:20 PM.

  2. #2
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Hi:
    I see several errors on your page as far as how you're invoking the ajax routine. Here is the relevant portion of your page:

    Code:
    <script type="text/javascript">
    
    function createpoststring(){
    var namevalue=document.getElementById("relatives").innerHTML //get value to post from a DIV
    var agevalue=document.getElementById("myform").agefield.value //get value to post from a form field
    var poststr = "name=" + encodeURI(namevalue) + "&age=" + encodeURI(agevalue)
    return poststr
    }
    
    //Step 3: Invoke the Ajax routine method to make the desired Ajax request.
    var poststr=createpoststring() //Get contents to post and create query string first
    ajaxpack.postAjaxRequest("postit.php", poststr, processGetPost, "txt")
    
    </script>
    
    <a href="#" onclick="var poststr=createpoststring(); ajaxpack.postAjaxRequest('ajaxfiles/postit.php', poststr, processGetPost, 'txt'); return false">
    Run example</a> | Source for <a target="eg" href="ajaxfiles/postit.php.txt">
    postit.php</a>
    It's hard to articulate all the errors above, but the correct version should look something like:

    Code:
    <script type="text/javascript">
    
    function processGetPost(){
    var myajax=ajaxpack.ajaxobj
    var myfiletype=ajaxpack.filetype
    if (myajax.readyState == 4){ //if request of file completed
    if (myajax.status==200 || window.location.href.indexOf("http")==-1){ //if request was successful or running script locally
    if (myfiletype=="txt")
    alert(myajax.responseText)
    else
    alert(myajax.responseXML)
    }
    }
    }
    
    function createpoststring(){
    var namevalue=document.getElementById("relatives").innerHTML //get value to post from a DIV
    var agevalue=document.getElementById("myform").agefield.value //get value to post from a form field
    var poststr = "name=" + encodeURI(namevalue) + "&age=" + encodeURI(agevalue)
    return poststr
    }
    
    var poststr=createpoststring() //Get contents to post and create query string first
    
    </script>
    
    <a href="#" onClick="ajaxpack.postAjaxRequest("postit.php", poststr, processGetPost, "txt"); return false">
    Run example</a> | Source for <a target="eg" href="ajaxfiles/postit.php.txt">
    postit.php</a>
    As you can see, your code is missing a function, plus is invoking the onClick= portion incorrectly inside the link.

  3. #3
    Join Date
    May 2006
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you for your reply. I updated my code with your edits but it's still not working.

    http://3dfolio.com/ediblepoly/tmp.htm

  4. #4
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Mistrel
    Thank you for your reply. I updated my code with your edits but it's still not working.
    Had you validated your markup, you would have at least removed the obvious problem.

    There are several unrelated issues with that example.

    • You're using XHTML. Don't. There's no point in serving it to clients if they'll only end up parsing it as badly-written HTML. Moreover, XHTML plus a Transitional document type is step backward, so don't kid yourself about using the latest and greatest.
    • Your first heading is level four. Heading levels should never be skipped, and definitely never used just to attain some particular presentational effect. Use the correct levels, styling them with CSS as necessary.
    • You've included a form element, yet you have no intention of using it as a form. Why? In my opinion, if your example is even close to what you're really trying to do, you shouldn't be using AJAX at all.
    • You use the encodeURI function to percent encode values. However, that function is meant to transform entire URIs. The encodeURIComponent function would be more appropriate, but you should be aware that some older browsers do not implement either function.
    Good luck,
    Mike
    Last edited by mwinter; 05-17-2006 at 11:58 AM.

  5. #5
    Join Date
    May 2006
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Score!! Thank you for that link for wc3 validation. I had no idea there was a resource like that.

    The problem was in my href, as you said. I had used double quotes instead of single quotes to reference the php file.

    You've included a form element, yet you have no intention of using it as a form. Why? In my opinion, if your example is even close to what you're really trying to do, you shouldn't be using AJAX at all.
    This is the same code provided from the DD example. I was only concerned with uncovering why the link wasn't working correctly.

    I still don't understand why it didn't work even when I copied exactly what was from the example's source. I tried using xhtml because that was the same doctype used on the DD page.

    Everything is working now:

    http://3dfolio.com/ediblepoly/ajaxroutine.htm
    Last edited by Mistrel; 05-17-2006 at 08:44 PM.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •