JavaScript - Js/ajax Problem. Help Needed (please)!

i have used a an ajax xml ticker script in my webpage
here's the link to the page where i got the script : http://www.dynamicdrive.com/dynamicindex2/cmarquee2.htm

The problem is as soon as it reaches the end of the content, It does not cycle up to the first news item immediately there is a gap of few seconds before starts showing the items again.

Hello,

Currently, i am working on a website. I need that when the data comes from ajax in the div or span tag, it should take space by moving down the data already present there without overwriting it.

But it doesnot happens. When i get data through ajax, then it overwirtes the previous data which was already present there and doesnot move the previous data downwards.


Any help plz

Hi Chaps,

I'm trying to get a AJAX script to work, but am having problems.

I have a page with two dropdown menus, the idea is that the first dropdown [customers] will then filter the options of the second [contacts]:

//DROPDOWN.PHP
PHP Code:
<form method="post" action="">
<select name="customer" onChange="ContactGrab('."'".'ajaxcalling.php?id='."'".'+this.value);">
    <option value="">Select Customer</option>
    <?php
do {  
?>
    <?php echo "<option value=".'"'.$row_rsCustomer['custid'].'" >'.$row_rsCustomer['custname']."</option>";?>
    <?php
} while ($row_rsCustomer = mysql_fetch_assoc($rsCustomer));
  $rows = mysql_num_rows($rsCustomer);
  if($rows > 0) {
      mysql_data_seek($rsCustomer, 0);
      $row_rsCustomer = mysql_fetch_assoc($rsCustomer);
  }
?>
  </select><br />
<div id="details">
  <select name="details">
  <option value="">Select Contact</option>
    <?php
do {  
?>
    <option value="<?php echo $row_rsContact['contactname']?>"><?php echo $row_rsContact['contactname']?></option>
    <?php
} while ($row_rsContact = mysql_fetch_assoc($rsContact));
  $rows = mysql_num_rows($rsContact);
  if($rows > 0) {
      mysql_data_seek($rsContact, 0);
      $row_rsContact = mysql_fetch_assoc($rsContact);
  }
?>
  </select>
  </div>
</form>

The OnChange action should call the AJAXCALLING.PHP page, where the other select options are filtered, by column [FK_custid]

//AJAXCALLING.PHP
PHP Code:
<select name="details">
<option value="">Select Contact</option>
  <?php
do {  
?>
  <option value="<?php echo $row_rsContact['contactid']?>"><?php echo $row_rsContact['contactname']?></option>
  <?php
} while ($row_rsContact = mysql_fetch_assoc($rsContact));
  $rows = mysql_num_rows($rsContact);
  if($rows > 0) {
      mysql_data_seek($rsContact, 0);
      $row_rsContact = mysql_fetch_assoc($rsContact);
  }
?>
</select>

This is powered by the AJAXSCRIPT.JS page
Code:

function CreateXmlHttpObject() { //fuction to return the xml http object
		var xmlhttp=false;	
		try{
			xmlhttp=new XMLHttpRequest();//creates a new ajax object
		}
		catch(e)	{		
			try{			
				xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");//this is for IE browser
			}
			catch(e){
				try{
				req = new ActiveXObject("Msxml2.XMLHTTP");//this is for IE browser
				}
				catch(e1){
					xmlhttp=false;//error creating object
				}
			}
		}
		 	
		return xmlhttp;
	}
	

  function CategoryGrab(strURL)
    {         
     var req = CreateXmlHttpObject(); // fuction to get xmlhttp object
     if (req)
     {
      req.onreadystatechange = function()
     {
      if (req.readyState == 4) { //data is retrieved from server
       if (req.status == 200) { // which reprents ok status                    
         document.getElementById('details').innerHTML=req.responseText;//put the results of the requests in or element
      }
      else
      { 
         alert("There was a problem while using XMLHTTP:\n");
      }
      }            
      }        
    req.open("GET", strURL, true); //open url using get method
    req.send(null);//send the results
     }
    }

My problem is that when I open the dropdown.php page, the browser status says 'Done, but with errors on the page' and the second dropdown isn't filtering. I can get rid of the status warning by removing:
Quote:
...onChange="ContactGrab('."'".'ajaxcalling.php?id='."'".'+this.value);">
But obviously that is something that is needed to pass the [custid] in the URL parameter....
Can anyone help me on this, as I haven't got a clue what I'm missing or where I have gone wrong!

Dear forum guys,
I'm having a problem regarding the POST method with Ajax.
I'm sending form inputs through Ajax by POST method to an ASP file to add them back to a database.
However, what i noticed is that whenever i send the inputs of the form let's say ("username") through Ajax by the POST method, the result is the input "username" however with no spaces.
Why is it that the Ajax POST method ignores the spaces and sends the inputs without the spaces?
I tried it with the GET method and found out that GET doesn't ignore the spaces, it worked. But the application that i'm trying to build requires sending bigger data that the GET method can't send. SO therefore i need the POST method but i ran into the problem of Spaces Being Ignored.

Please, is there a way to send any string that contains spaces through AJAX POST method and not ignore the spaces in the output???

Thank You
David

All,

I am trying to create a page for a application that uses a technique where a page refresh is generated by an ajax call followed by an innerhtml replace on the main page div.

Unfortunately this strange way of refreshing pages is leading to an issue with an image I am trying to display. Every time it refreshes the images flashes off and then is redisplayed, there are other elements on the page( smaller images, text etc... ) and they do not seem to be affected.

The image is not large, only 23 k, but it is the only one affected. If I run the page on firefox I do not encounter this issue which makes me think that is a lovely IE feature that forces the image to be retrived from the server on every innerhtml replace instead of from the cache.

I am using IE8 to test this, any suggestions are greatly appreciated as I have been trying to fix this for a while.

Thanks,
N

Edit: Nevermind

Hey, as the subject says... I'm struggling to call other external files from within a file, requested by an Ajax.Request.

It's bascically a request to call a file that updates a mysql database, and I want to include my database connection php file so I don't have to keep repeating my connection settings.

here is the request:

Code:

new Ajax.Request('tools/server_reorder_list.php', options);

and within that file I'm trying to do something like this:

Code:

include ("../config/dbconnect.php");

$i=1;
foreach($_POST['item_list'] as $key=>$value) {
mysql_query("UPDATE `cs_pages` SET `position`='".$i."' WHERE id_page ='".$value."'");
$i++;
}

I've tried all kinds of ways to include the files, from the above, to typing the entire path.

The only way I can get this request to work is by actually typing my connection settings in the requested file.

Any help greatly appreciated.

Thanks!

hello, can anyone help me with a javascript-php-ajax problem?

I have created a table with checkboxes and whenever an ajax function is called to refresh, the checkboxes that were highlighted and checked get reset, here is my javascript for the check function:

$(document).ready(function()
{
$("#checkall").live('click',function(event){
$('input:checkbox:not(#checkall)').attr('checked',this.checked);

//To Highlight
if ($(this).attr("checked") == true)
{

//$(this).parents('table:eq(0)').find('tr:not(#chkrow)').css("background-color","#FF3700");
$("#policy").find('tr:not(#chkrow)').css("background-color","#FC9A01");
}
else
{

//$(this).parents('table:eq(0)').find('tr:not(#chkrow)').css("background-color","#fff");
$("#policy").find('tr:not(#chkrow)').css("background-color","#FFF");
$("#policy").find('tr.alt:not(#chkrow)').css("background-color","#EAF2D3");
}

});

$('input:checkbox:not(#checkall)').live('click',function(event)
{
if($("#checkall").attr('checked') == true && this.checked == false)
{
$("#checkall").attr('checked',false);
$(this).closest('tr').css("background-color","#ffffff");
}
if(this.checked == true)
{
$(this).closest('tr').css("background-color","#FC9A01");
CheckSelectAll();
}
if(this.checked == false)
{
$(this).closest('tr').css("background-color","#ffffff");
$(this).closest('tr.alt').css("background-color","#EAF2D3");
}
});

function CheckSelectAll()
{
var flag = true;
$('input:checkbox:not(#checkall)').each(function() {
if(this.checked == false)
flag = false;
});
$("#checkall").attr('checked',flag);
}

});

I am using this code... simplified for example

Code:

[
<script type="text/javascript">

function loadContent(elementSelector, sourceURL) {
$(""+elementSelector+"").load(""+sourceURL+"");
}
</script>



<a onclick="loadContent('#content', 'http://www.website.com/includes/content.php');"


<div id="content"></div>

Works fine if run on http://www.website.com but not on http://www.website.com/home/sitepage. I have spent a few hours and cannot figure it out. Can anyone? Thanks

Hi,

I have a problem with sending data from a form to a php script with AJAX. To test if it works, I try to send data from the form, print it in the php with "echo", and then put it back in the initial html file.

My Javascript code is:
Code:

function registerPrivateUser()
{
	xmlhttp=GetXmlHttpObject();
	if (xmlhttp==null)
	{
	  alert ("Your browser does not support AJAX!");
	  return;
	}
	
	var postData="firstName="+ document.getElementById("txtFirstName").value;
	var url="classes/users/checkRegistration.php";
	
	xmlhttp.onreadystatechange=stateChanged;
	xmlhttp.open("POST",url,true);

	
	//xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8"); 
	
	xmlhttp.send(postData);
}

The function stateChanged, basically says:
Code:

if (xmlhttp.readyState==4)
	{
		var strResponse;
		strResponse=xmlhttp.responseText;
		alert('Response:' + xmlhttp.responseText);
	}

checkRegistration.php looks like this:
PHP Code:
<?
session_start();
$firstName=$_POST['firstName'];
echo($firstName);
?>

The problem is that the response is empty, but I don't know why. I have checked the input data and the postData variable says "firstName="+input (e.g. "firstName=Robert"), so that's not the error. I have read several forum posts here, but still haven't figured out what I'm doing wrong.
If anyone could please tell me, I would appreciate it alot.

Hi,

I am hoping I just need to be pointed in the right direction with this.

I have Page1.

When Page1 body onloads it uses Ajax to call PartA

Within PartA I have a message board so members can write messages which will be sent to my database in PartA[1] and immediately posted for view on to PartA[2]. As I want to have my request to the server updating regularly I want to have PartA[2] on a timed loop to refresh - I do not need the content of PartA[1] to refresh.

So the order of events would look like this:
Page1
|
onload call
|
v
PartA
/ \
V V
PartA[1] PartA[2]
(loads once) (constantly refreshes)

What I am not sure about is that I have <body> and <head> attributes in Page1 only. I have already used my body onload to call PartA (and can't use it to call PartA[2] before PartA has loaded anyway).

I do not want the user to have to click a button or do anything to call up PartA[2].

So my question is how would I get PartA[2] to automatically load within PartA?

I hope I have made this clear, but if I haven't let me know and I will try again.

i have a html wich i am working on ..


Code:

<html>
<head>

<script language="Javascript">
function xmlhttpPost(strURL) {
    var xmlHttpReq = false;
    var self = this;




    // Mozilla/Safari
    if (window.XMLHttpRequest) {
        self.xmlHttpReq = new XMLHttpRequest();
        
    }
    // IE
    else if (window.ActiveXObject) {
        self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
    }
    self.xmlHttpReq.open('POST', strURL, true);



    self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    self.xmlHttpReq.onreadystatechange = function() {
        if (self.xmlHttpReq.readyState == 4) {           
            updatepage(self.xmlHttpReq.responseText);
        }

    }
    


    self.xmlHttpReq.send(getquerystring());
}





function getquerystring() {


    var form     = document.forms['f1'];
    var username = form.username.value;

    qstr = 'u=' + escape(username);         
        return qstr;

}






function updatepage(str){
    
var s = str;
var a = s.split(',');


var a1 = a[0];
var a1_1 = a[1];
var a2 = a[2];
var a2_1 = a[3];
var a3 = a[4];
var a3_1 = a[5];
var a4 = a[6];
var a4_1 = a[7];
var a5 = a[8];
var a5_1 = a[9];
var a6 = a[10];
var a6_1 = a[11];
var a7 = a[12];
var a7_1 = a[13];
var a8 = a[14];
var a8_1 = a[15];
var a9 = a[16];
var a9_1 = a[17];
var a0 = a[18];
var a0_1 = a[19];





var form     = document.forms['f1'];
form.result1.value = a1;
form.result1_1.value = a1_1;
form.result2.value = a2;
form.result2_1.value = a2_1;
form.result3.value = a3;
form.result3_1.value = a3_1;
form.result4.value = a4;
form.result4_1.value = a4_1;
form.result5.value = a5;
form.result5_1.value = a5_1;
form.result6.value = a6;
form.result6_1.value = a6_1;
form.result7.value = a7;
form.result7_1.value = a7_1;
form.result8.value = a8;
form.result8_1.value = a8_1;
form.result9.value = a9;
form.result9_1.value = a9_1;
form.result0.value = a0;
form.result0_1.value = a0_1;
}
</script>
</head>







<body>
<form name="f1">

<p>Username: <input name="username" type="text" id="username">  
<p>Password: <input name="password" type="text" id="password"> 
  <input value="Go" type="button" onclick='JavaScript:xmlhttpPost("/cgi-bin/3sms/smscontacts.pl")'></p>

<input name="result1" type="text" id="result1" size="18" maxlength="25">
<input name="result1_1" type="text" id="result1_1" size="11" maxlength="11"><p> 
<input name="result2" type="text" id="result2" size="18" maxlength="25">
<input name="result2_1" type="text" id="result2_1" size="11" maxlength="11"><p> 
<input name="result3" type="text" id="result3" size="18" maxlength="25"> 
<input name="result3_1" type="text" id="result3_1" size="11" maxlength="11"><p> 
<input name="result4" type="text" id="result4" size="18" maxlength="25">  
<input name="result4_1" type="text" id="result4_1" size="11" maxlength="11"><p>  
<input name="result5" type="text" id="result5" size="18" maxlength="25"> 
<input name="result5_1" type="text" id="result5_1" size="11" maxlength="11"><p> 
<input name="result6" type="text" id="result6" size="18" maxlength="25">  
<input name="result6_1" type="text" id="result6_1" size="11" maxlength="11"><p>  
<input name="result7" type="text" id="result7" size="18" maxlength="25"> 
<input name="result7_1" type="text" id="result7_1" size="11" maxlength="11"><p> 
<input name="result8" type="text" id="result8" size="18" maxlength="25">  
<input name="result8_1" type="text" id="result8_1" size="11" maxlength="11"><p>  
<input name="result9" type="text" id="result9" size="18" maxlength="25"> 
<input name="result9_1" type="text" id="result9_1" size="11" maxlength="11"><p> 
<input name="result0" type="text" id="result0" size="18" maxlength="25">  
<input name="result0_1" type="text" id="result0_1" size="11" maxlength="11"><p> 



</div>
  
</form>
</body>
</html>

now my problem is the password is not sent to the perl script
i basicly modified an ajax from another form to do this form.
when the "go" is pressed the username is sent and a string is recived and devided into the form inputs..
all i need to do now is send the password along with the username
the username variable is "u"
i would like the password variable to be "p"
any ideas

Hello everyone. I was working on a ajax function and I can't seem to figure out what I'm doing wrong here. I'm kinda new with the prototype method I was wondering if I could get some help figuring out what I'm doing wrong here exactly and how I can fix this.

Any help on this would be wonderful.

Thanks,
Jon W

Code:

	function createAjax() {
		if(!this.http && window.ActiveXObject) {
			try {
				this.http = new ActiveXObject("Msxml2.XMLHTTP" || "Microsoft.XMLHTTP");
			}
			catch(e1) {
				this.http = false;
			}
			
		}
		
		if(!this.http && window.XMLHttpRequest) {
			try {
				this.http = new XMLHttpRequest();
			}
			catch(e2) {
				alert("Sorry we was unable to make a request between your browser.");
			}
		}
	}
	
	createAjax.prototype.request = function(url) {
	var rmd = Math.random();
		this.http.open('get', url+"&rmd="+rmd, true);
		this.http.send(null);
		
		this.http.onreadystatechange = this.responseHandler;
	}
	
	
	createAjax.prototype.responseHandler = function(obj) {
		if(this.http.readyState == 4) {
			document.getElementById(obj).innerHTML = this.responseText;
		}
	
	}
	function ajax(url, obj) {
	a = new createAjax();
	a.request(url);
	a.responseHandler(obj);
	}
	
	var doAjax = new ajax('ajax.php?name=jon','content');