JavaScript - Ajax Refresh Problem...

I'm using meta refresh to refresh my web page. I have a small compose email window that appears via ajax when the user clicks on a name.

Is there a way I can disable the screen refresh in my ajax code while they are composing their message?

Hi Frnds,

I have faced some problem i.e I have 2 jsp pages.In that I want to go one jsp to another jsp.In 2nd jsp i can show my captcha code,but unfortunately it is not visible first page is reloaded in IE6.Once you refresh the page it's visible in IE6.So please help me to avoid this problem.

Thanks,

I'm making a chess game and I have a couple of problems. one, for some reason I need to refresh the page for it to fully load

http://ktownsend.shorelinevct.net/chess/

two, hiding the available moves only works when I click on a different piece. when clicking on the same piece I get an err.message which says that the pieces this.availMoves[i] = null. which doesn't make sense. I get the same err.message when I click on a different piece but it works anyway. when I click on the same piece it doesn't work at all.

Any help would be appreciated

Hi,

I'm having a problem with my page not resetting to the point where the user clicked on an element. I believe this to be a javascript problem, however, if it is not I would be glad to move it to the proper forum.

What I have is a page with a div that contains a large image (a map). the dims are 1237 x 1550. I am using a browser window resized to approx. 800 x 600 so that I can simulate a smaller screen viewport. The page has links that are scattered about the map (positioned with css) and what I want to do is launch a video using the HTML5 video tag when the user clicks on a link. The video is supposed to open in the center of the users viewport and then dim the map div, which it does, however the page resets its position after the js function and aligns the page back to the upper left corner of the browser window. If the user had scrolled (both x and y) to the max of the scroll bar, then this will be fairly frustrating to have to keep moving back, thus my dilemma.

I tried using scrollto to reset the scroll back to where the user was, but this is not working. What's funny is if I put an alert at the very end of the function, the page displays properly (video is centered on the screen where the user was in their viewport) but resets as soon as the alert is closed. I then tried using location.reload(false), but this keeps the function from running properly (the page shows properly for a fraction of a second then resets back to a newly launched page).

Below is the code. Also, this has only been tested with FF and Chrome on my local drive. It is not anywhere on the web right now. In chrome, the page resets to the top only. I'm really not interested in making this work with IE since this is for personal/family use. Your help is greatly appreciated.

Code:

CSS
	body {
		background: black;
		text-align: center;
		vertical-align: middle;
	}	
	div#bkg {
		position: absolute;
		text-align: center;
		z-index: 1;
	}
        p#day1 {
		position: absolute;
		top: 800px;
		left: 1000px;
		font-weight: bold;
		width: 50px;
		background: white;
	}

Javascript
function showVid(srcVid) {
// set the proper filename of the vid
	srcVid = srcVid + ".ogv";
// create the video tag
	var vidWin = document.createElement("video");
	vidWin.id = "movie";
	vidWin.setAttribute("width", "320");
	vidWin.setAttribute("height", "240");
	vidWin.setAttribute("controls", "controls");
// pic size is 1237 x 1550
	var vpw = window.innerWidth;
	var vph = window.innerHeight;
	var xPosOff = window.pageXOffset;
	var yPosOff = window.pageYOffset;
	var leftNum = ((vpw/2) + xPosOff) - 160;
	var topNum = ((vph/2) + yPosOff) - 120;
	vidWin.setAttribute("style", "position: absolute; left: " + leftNum + "px; top: " + topNum + "px; z-index: 255;");
// create the source tag
	var vidSrc = document.createElement("source");
	vidSrc.src = "videos/" + srcVid;
	vidSrc.type = "video/ogg";
	vidSrc.codecs = "theora, vorbis";
	vidWin.appendChild(vidSrc);
	document.getElementById('bkg').style.opacity = 0.5;
	document.body.appendChild(vidWin);
	window.scrollTo(xPosOff, yPosOff);
// tried this, it didn't work
//	location.reload(false);
}

HTML
<body>
<div id='bkg'>
<img src="images/pic1.jpg" />
<p id="day1"><a href="#" onclick="showVid('oggtest')">Day 1</a></p>
</div>
</body>

I have the following ajax code:

Quote:
.............
.............
.............
XHR.createXMLHttp();
XHR.open("POST", "/cgi-bin/addpost.cgi", true);
XHR.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
XHR.onreadystatechange = function() {
if (XHR.readyState == 4) {
if (XHR.status == 200) {
alert("Operazione effettuata con successo");
}
else {
alert("Operazione non riuscita");
}
}
}
XHR.send(url);
The function send data, but it don't return never alert windows. Where is the problem?

hi everyone..
i am using ajax to change the banner background while pressing on refresh
Note:it must be a background image because i will display data from database...


http://www.graphicano.com/isis/nile_crown2.php

please look at this link...

my problem is:
when i press refresh button in Firefox browser it changes the background and on pressing refresh again the background will change

but in internet explorer 8.0 it changes the background only for the first time and on pressing refresh again the background will not change.

how i can fix this problem ?? i want the user to press refresh at any time and the background will change.. not only for the first time?
at the same time it must be a background image because i will display text from database...

Firstly I apologize if this is the wrong forum, I wasn't too sure of where to post it as my problem covers several areas.

I have been writing a 'Facebook Application' which is primarily in PHP. It is about the economics of futuristic spaceship production. I have done the bulk of the game mechanics in PHP and have set about making the interface.

I am stuck on a page which can be viewed here where you can employ workers to work in your mines/factories.

Each worker has five skill types (worker, miner, manager etc...) and to be employed he must be offered a contract for one of those skills.

The process of employing someone works like this.

1. You search for the 'type' of worker you want.
2. Search Results are shown.
3. You click on the name of the person you want to employ.
4. A new form appears (under the table) for you to fill in the contract details.
5. The person (PHP function!) rejects or accepts the contract.

If you look at the link above you will see I've made a search box which uses AJAX/html/php to make the table (which I'm quite proud of as I'm a bit of a noob when it comes to javascript/ajax). Ive come unstuck as to how to select which worker to offer a contract to. What needs to happen is:

1. The name or a tick box is selected.
2. It sends some form of unique identifier back to the same page so the form (to offer a contract) knows which person in the table is being referred to *preferably without a page refresh*.

Any help/advice would be greatly appreciated. I'm assuming I'm going to need to use some form of get/post and ajax but i cant figure out how to do it.
I hope all this makes sense.

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!

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.

I'm a newbie so excuse me if question could be stupid
I have a webpage where i have placed a form html with recaptcha validation
I have grabbed on the net following code :

Code:
Code:

<script type="text/javascript">
function validateCaptcha()
{
    challengeField = $("input#recaptcha_challenge_field").val();
    responseField = $("input#recaptcha_response_field").val();
    //alert(challengeField);
    //alert(responseField);
    //return false;
    var html = $.ajax({
    type: "POST",
    url: "http://mysite.com/script.php",
    data: "recaptcha_challenge_field=" + challengeField + "&recaptcha_response_field=" + responseField,
    async: false
    }).responseText;
    
    if (html.replace(/^\s+|\s+$/, '') == "success")

    {
		
        $("#show").html("Success. Submitting form.");
		
        return false;
        // Uncomment the following line in your application
        //return true;
    }
    else
    {
        $("#show").html("Your captcha is incorrect. Please try again");
        Recaptcha.reload();
        return false;
    }
}
</script>

and form html:

Code:
Code:

<form action="#"  method="post" onSubmit="return validateCaptcha()">

<p><?php echo recaptcha_get_html($publickey);?></p>
    <p style="color: red;" id="show">&nbsp;</p>
    <input type="submit" name="Submit" value="Submit">

</form>

On the file: script.php i have placed php code:

PHP Code:
PHP Code:
<?php
require_once('controllers/recaptchalib.php');

$privatekey = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx";

# was there a reCAPTCHA response?
{
    $response = recaptcha_check_answer ($privatekey,
                                $_SERVER["REMOTE_ADDR"],
                                $_POST["recaptcha_challenge_field"],
                                $_POST["recaptcha_response_field"]);

if (!$response->is_valid) {
  echo 'ERROR: The recaptcha code was not entered correctly or expired.';
  die;

  
    
}

else   
echo "success";
}


?>

the code work but i don't want display in my webpage only messages:
"Your captcha is incorrect. Please try again" if code is incorrect and
"Success. Submitting form." if code is correct.
But if the code is correct i want display under sentence "Success. Submitting form." the content of script.php ie print a table or whatever script contain obviously without reloading webpage or redirect to another page
How to?
thanks

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,

I have the below code:
Code:

<script type="text/javascript">
function loadQuickMessageCheck(File,ID){

var xmlhttp; 

if (window.XMLHttpRequest)  {
  xmlhttp=new XMLHttpRequest();
  }
else {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById(ID).innerHTML=xmlhttp.responseText;
	 eucalyptus = setInterval(function(){loadQuickMessageCheck(File,ID)},20000);
    }
  }

xmlhttp.open("POST",File,true);
xmlhttp.send();
}
</script>

But I am overloading the server and crashing it. I've googled the issue and have found people with similar problems who talk about the need to cancel the last refresh request before they send the next refresh.

I even found this nice piece of code which worked for someone else.
Quote:

try{window.clearTimeout(tRefresh)} catch(err) {}
tRefresh = setInterval(setContext, varInterval*60*1000);
}
I am not sure if this is the solution that I am looking for but if it is all my attempts at applying this code has been a bit of a disaster.

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

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

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!