AJAX Form Problem??

**gits** · May 8 '09, 04:20 PM

no problem ... simply ask here in case you have specific problems with the shown code there ...

kind regards

**ziycon** · May 8 '09, 04:54 PM

Ok, I've gone through the code and I've added it to my code they way that i need it but i just don't under stand what the code is doing so i can't figure out where I'm going wrong!?

So i have:

Code:

<html>
<head>
<script type="text/javascript" language="javascript">
	var loading_img = '/media/images/layout/loading.gif';
	var loading_msg = ' Loading...';
	var xmlhttp_obj = false;//create the XMLHttpRequest
	
	function ewd_xmlhttp()
	{
		if (window.XMLHttpRequest)
		{ // if Mozilla, Safari etc
			xmlhttp_obj = new XMLHttpRequest();
		}
		else if (window.ActiveXObject)
		{ // if IE
			try
			{
				xmlhttp_obj = new ActiveXObject("Msxml2.XMLHTTP");
			}
			catch (e)
			{
				try
				{
					xmlhttp_obj = new ActiveXObject("Microsoft.XMLHTTP");
				}
				catch (e)
				{

				}
			}
		}
		else
		{
			xmlhttp_obj = false;
		}

		return xmlhttp_obj;
	}   //get content via GET

	function getcontent(url, containerid)
	{
		var xmlhttp_obj = ewd_xmlhttp();
		document.getElementById(containerid).innerHTML = '<img src="' + loading_img + '" />' + loading_msg;
		xmlhttp_obj.onreadystatechange=function()
		{
			loadpage(xmlhttp_obj, containerid);
		}
		xmlhttp_obj.open('GET', url, true);
		xmlhttp_obj.send(null);
	}     

	function loadpage(xmlhttp_obj, containerid)
	{
		if ( xmlhttp_obj.readyState == 4 && xmlhttp_obj.status == 200 )
		{
			document.getElementById(containerid).innerHTML = xmlhttp_obj.responseText;
		}
	}
//]]>
</script>
<script type="text/javascript" src="sys/js/webtoolkit.aim.js"></script>
	<script type="text/javascript">
		function startCallback() {
			// make something useful before submit (onStart)
			return true;
		}
 
		function completeCallback(response) {
			// make something useful after (onComplete)
			document.getElementById('nr').innerHTML = parseInt(document.getElementById('nr').innerHTML) + 1;
			document.getElementById('r').innerHTML = response;
		}
</script>

</head>
<body>
<div id="teamdb_container">
                <form method="post" onsubmit="return AIM.submit(this, {\'onStart\' : startCallback, \'onComplete\' : completeCallback})">
                <div id="teamdb_title">/New Team</div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">Group Name:</div>
                    <div class="teamdb_line_text"><input type="text" id="name" name="name" size="40" maxlength="80" /></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">Website:</div>
                    <div class="teamdb_line_text"><input type="text" id="url" name="url" size="40" maxlength="80" /></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">Banner:</div>
                    <div class="teamdb_line_text"><input type="file" id="banner" name="form[file]" size="50">
                    <input type="hidden" name="MAX_FILE_SIZE" value="1000000"></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">About Us:</div>
                    <div class="teamdb_line_text"><textarea id="body" name="body" rows="10" cols="60"></textarea></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_button"><input type="submit" value="Add New Team" onclick="getcontent(\'sys/ajaxCalls.php?acid=101&value=\'+document.getElementById(\'name\').value+\'-\'+document.getElementById(\'url\').value+\'-\'+document.getElementById(\'banner\').value+\'-\'+document.getElementById(\'body\').value,\'teamdb_container\')" /></div>
                </div>
                </form>
            </div>
</body>
</html>

And then it goes here:

Code:

if($acid == 101) {
          $value = explode('-',$value);
          if(($value[0]!='') && ($value[1]!='') && ($value[2]!='') && ($value[3]!='')) {
              //Store to DB query here
               echo '<div id="teamdb_container">
                      <meta http-equiv="refresh" content="2;url=teamdb.html">
                      <div id="db_add_successful">Team has been added successfully!</div>
                      <div id="redirect_msgs">You will be redirected in 2 seconds...</div>
                    </div>';
          }
          else {
              echo '<div id="teamdb_container">
                <form method="post" onsubmit="return AIM.submit(this, {\'onStart\' : startCallback, \'onComplete\' : completeCallback})">
                <div id="teamdb_title">/New Team</div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">Group Name:</div>
                    <div class="teamdb_line_text"><input type="text" id="name" name="name" value="'.$value[0].'" size="40" maxlength="80" /></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">Website:</div>
                    <div class="teamdb_line_text"><input type="text" id="url" name="url" value="'.$value[1].'" size="40" maxlength="80" /></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">Banner:</div>
                    <div class="teamdb_line_text"><input type="file" id="banner" name="form[file]" size="50">
                    <input type="hidden" name="MAX_FILE_SIZE" value="1000000"></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_name">About Us:</div>
                    <div class="teamdb_line_text"><textarea id="body" name="body" rows="10" cols="60">'.$value[3].'</textarea></div>
                </div>
                <div class="teamdb_line_wrapper">
                    <div class="teamdb_line_button"><input type="submit" value="Add New Team" onclick="getcontent(\'sys/ajaxCalls.php?acid=101&value=\'+document.getElementById(\'name\').value+\'-\'+document.getElementById(\'url\').value+\'-\'+document.getElementById(\'banner\').value+\'-\'+document.getElementById(\'body\').value,\'teamdb_container\')" /></div>
                </div>
                </form>
            </div>';
          }
      }

AJAX Form Problem??

Comment

Comment