Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts

    AJAX does not work without an alert

    Instead of an id getting its innerHTML changed, the entire page is getting refreshed with this function of mine (you may want to look just at the end of the function where there's an alert):

    Code:
    function morerating(ratingform, checkflag, loc)
    {
    	var f = document.forms[ratingform];
    	var rating_done_flag = 0;
    	var params = "";
    	if (checkflag == true)
    		check = checkrating(ratingform);
    	else 
    		check = true;
    	if(check == true)
    	{
    		f.submit_rating_done.value = "";
    		for (i=0;i < f.elements.length;i++) { 
    			if(f.elements[i].type == 'radio' || f.elements[i].type == 'checkbox')
    			{
    				if(f.elements[i].checked)
    				{
    					params = params + f.elements[i].name +'='+ encodeURI(f.elements[i].value) + '&'; 
    					if (f.elements[i].name == "rating_1" || f.elements[i].name == "rating_2" || f.elements[i].name == "rating_3" || f.elements[i].name == "rating_4" || f.elements[i].name == "rating_overall")
    						rating_done_flag = 1;
    				}
    			}
    			else if (f.elements[i].name && f.elements[i].value)
    			{
    				params = params + f.elements[i].name +'='+ encodeURI(f.elements[i].value) + '&';
    			}
    		}
    		shows = loc;
    		xmlHttp=GetXmlHttpObject();
    		if (xmlHttp==null)
    		{
    			alert ("Browser does not support HTTP Request");
    			return;
    		}
    		if(document.getElementById('morehide'))
    		{
    			document.getElementById('morehide').style.display = "none";
    			document.getElementById('morehide').innerHTML = "";
    		}
    		if(shows == "rating_main_block" || shows == "rating_main_block_editorial" || shows == "loginbox" || shows == "editorial_loginbox")
    		{
    			params = params + "submit_rating_done=1&";
    			params = params + "xmlrequest=1&";
    		}
    		else
    		{
    			if(!document.getElementById('morehide'))
    			{
    				f.submit_rating_done.value = "Submit";
    			}
    		}
    		params = params + "shows="+shows;
    		var url='/blocks/profiles/common/user_store.php';
    		url=url + "?" + params;
    		xmlHttp.onreadystatechange=stateChangedALL;
    		xmlHttp.open("GET",url,true);
    		xmlHttp.send(null);
    		//setTimeout('window.scrollBy(0, 350)', 1000);
    		//alert('help2');
    		return true;
    	}
    	else
    	{
    		return false;
    	}
    }
    That alert('help2'), if removed, causes the page to just reload, but with it, AJAX works fine. I tried some dummy setTimeout option also as you can see, but that doesn't seem to help either. I also tried setTimeout("alert('help2')", 1000).

    If it helps, these are the other functions referred to there, though they're pretty standard AJAX stuff:

    Code:
    function stateChangedALL()
    {
    	if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
    	{
    			document.getElementById(shows).style.display="block"
    			if (xmlHttp.responseText != "")
    				document.getElementById(shows).innerHTML=xmlHttp.responseText
    			else
    				document.getElementById(shows).style.display="none"
    			var the_node = document.getElementById(shows);
    			execJS(the_node);
    			if(document.getElementById(trashid))
    			{
    				xmlHttp2.send(null);
    			}
    	}
    	else
    	{
    			document.getElementById(shows).innerHTML="<br><br><div class=\"a9bl\" align=\"center\"><font color=black>Loading, please wait...</font><div>"
    	}
    }
    and

    Code:
    function GetXmlHttpObject()
    { 
        var req = false;
        // branch for native XMLHttpRequest object
        if(window.XMLHttpRequest && !(window.ActiveXObject)) 
    	{
    		try {
    			req = new XMLHttpRequest();
            } catch(e) {
    			req = false;
            }
        // branch for IE/Windows ActiveX version
        }
    	else if(window.ActiveXObject) 
    	{
           	try {
            	req = new ActiveXObject("Msxml2.XMLHTTP");
          	} catch(e) {
            	try {
              		req = new ActiveXObject("Microsoft.XMLHTTP");
            	} catch(e) {
              		req = false;
            	}
    		}
        }
    	return req
    }
    I'd be quite grateful for any pointers! Thank you for your time!

  • #2
    Senior Coder
    Join Date
    Oct 2008
    Location
    Long Beach
    Posts
    1,196
    Thanks
    36
    Thanked 164 Times in 164 Posts
    Lol without even seeing your HTML code I'm going to guess that your form has morerating() as it's onsubmit.

    If I'm right, then that right there is your problem. You need to return false if you don't want the page to refresh on a form submit:
    Code:
    JS:
    function onFormSubmit(form_element){
    // do stuff
    return false;
    }
    
    HTML:
    <form onsubmit="return onFormSubmit(this)"></form>
    Feel free to e-mail me if I forget to respond ;)
    ohsosexybrit@gmail.com

  • #3
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts
    Hey itsallkizza, thanks for the post. Unfortunately, that doesn't seem to be what's wrong. This is my button:

    Code:
    <input name="submit_rating_done" value="Submit" onclick='return morerating("ratingform", false, "rating_main_block_editorial"); return false;' type="submit">
    Is there anything else that seems to suggest itself from that line of code? And like I asked, why should it work with the alert call and not without it?

  • #4
    Senior Coder
    Join Date
    Oct 2008
    Location
    Long Beach
    Posts
    1,196
    Thanks
    36
    Thanked 164 Times in 164 Posts
    Is that input inside of a <form>? If so, refer back to my first post.

    If not, please post the rest of your code.
    Feel free to e-mail me if I forget to respond ;)
    ohsosexybrit@gmail.com

  • #5
    Senior Coder
    Join Date
    Oct 2008
    Location
    Long Beach
    Posts
    1,196
    Thanks
    36
    Thanked 164 Times in 164 Posts
    You sent me your code in an email.

    The input in question submits a form. Refer back to Post #2 - I showed the proper way of submitting a form when you don't want it to move the location of your page.
    Feel free to e-mail me if I forget to respond ;)
    ohsosexybrit@gmail.com

  • #6
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts
    itsallkizza, you got it bingo in your first post, but it just wasn't getting into my head. I had to change the line "return true" in my morerating function to "return false", and nothing else . You kept telling me again and again, but I guess I needed to be spoon-fed. Thanks a heap for everything!

    Still, though, why was the alert making it work?

  • #7
    Senior Coder
    Join Date
    Oct 2008
    Location
    Long Beach
    Posts
    1,196
    Thanks
    36
    Thanked 164 Times in 164 Posts
    To be honest, I can't explain that one. The way you were doing it was something like this (which as you can see, still refreshes the page):
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Example</title>
    <style type="text/css">
    </style>
    <script type="text/javascript">
    // <![CDATA[
    
    function onFormSubmit()
    	{
    	alert("hey!");
    	}
    
    // ]]>
    </script>
    </head>
    <body>
    
    <form>
    	<input type="text" name="filler" value="some text" /><br />
    	<input type="submit" value="submit form" onclick="onFormSubmit()" />
    </form>
    
    <input type="button" value="change bg color" onclick="document.getElementsByTagName('body')[0].style.backgroundColor='red';" />
    
    </body>
    </html>
    All I can say is that if you run any asynchronous ajax code before the alert, the ajax data will be requested, returned and dealt with. It seems that somewhere along the line the browser forgot it was supposed to refresh (which obviously is a horrible explanation lol).

    And I'm glad you got it fixed I'm always happy to help!
    Last edited by itsallkizza; 12-23-2008 at 12:30 AM.
    Feel free to e-mail me if I forget to respond ;)
    ohsosexybrit@gmail.com


  •  

    Posting Permissions

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