JavaScript to PHP

**woofy613** · 06-27-2011 07:21 PM

Dear List -

I have a program that [hopefully] will use Ajax to move a variable from JavaScript to PHP. When it runs, it hangs with an error [Firebug]. When I force it to continue, it does give results. I would like the following: 1] don't hang and 2] not be forced to use document.write.

This is a chess program [jq_test.php]. When the user dbl-clicks on a squar, the coordinate of the square should be in the $_POST variable:

CODE:

Code:

<?php
 $results = array(array("Br", "Bn", "Bb", "Bq", "Bk", "Bb", "Bn", "Br"),array("Bp", "Bp", "Bp", "Bp", "Bp", "Bp", "Bp", "Bp"),
			array("", "", "", "", "", "", "", ""),array("", "", "", "", "", "", "", ""),array("", "", "", "", "", "", "", ""),
			array("", "", "", "", "", "", "", ""),array("Wp", "Wp", "Wp", "Wp", "Wp", "Wp", "Wp", "Wp"),
			array("Wr", "Wn", "Wb", "Wq", "Wk", "Wb", "Wn", "Wr"));
?>
		
snip...

	<head>
		<title>Jquery Test</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link type="text/css" href="jq.css" rel="stylesheet" />
		<link type="text/css" href="jquery-ui-1.8.9.custom.css" rel="stylesheet" />
	</head>
		<body>
			<div id="main">
			<fieldset  id="main_fieldset">
				<table  cellspacing="100">
					<tbody >
						<tr>
							<td class="b1">8</td><td class="d1" id="a8"><?php echo $results[0][0];?> </td><td class="a1" id="b8" ><?php echo $results[0][1];?>  
								</td><td class="d1" id="c8"> <?php echo $results[0][2];?> </td><td class="a1" id="d8"> 
								<?php echo $results[0][3];?> </td><td class="d1" id="e8"><?php echo $results[0][4];?>  </td><td class="a1" id="f8"> 
								<?php echo $results[0][5];?> </td>
								<td class="d1" id="g8"> <?php echo $results[0][6];?> </td><td class="a1" id="h8"> <?php echo $results[0][7];?>  </td>
						</tr>
		
snip...
<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.9.custom.min.js" ></script>

snip...

<script type="text/javascript">
$(document).ready(function(){
  		$('.a1').dblclick(function() {
    		$(this).css("background-color","blue");
    		move_from = $(this).attr("id");
			$.ajax({
			type: "POST",
			url: "jq_test.php",
			data:({move_from: this.getAttribute('id')}),
			dataType: "html",
			async:false,
  			success: function(msg){
	  		document.write(msg);
	  		}
		}).responseText;    		
			
	});	
 });
</script>

snip...

<?php 		
echo <<<HTML
			<form method="post" action="jq_test.php">
			Move From<input type="text" name="move_from"> </input><br /><br />
			Move To  <input type="text" name="move_to"></input><br /><br />
				<input type="submit" value="Enter Move"></input>
	
			</form>
HTML;
?>

Thanks in Advance

**DanInMA** · 06-27-2011 11:53 PM

1. PUT YOUR CODE IN A CODE BLOCK.

2. why are you using document.write in the first place? you are using Jquery, just use .html()

3. what are you trying to accomplish with your post data? Youve already made a variable to catch the id it's moving from, but you are reiterating it in the actual data....

Code:

<script type="text/javascript">
$(document).ready(function(){
$('.a1').dblclick(function() {
$(this).css("background-color","blue");
move_from = $(this).attr("id");
$.ajax({
type: "POST",
url: "jq_test.php",
data:move_from,
dataType: "html",
async:false,
success: function(msg){
$("#idorclassofelementyouneedtotarget").html(msg);
}
}).responseText; 

});	
});
</script>

**woofy613** · 07-06-2011 12:36 PM

Thanks.

Sorry for the delay.

Using this:

<script type="text/javascript">
$(document).ready(function(){
$('.a1').dblclick(function() {
$(this).css("background-color","blue");
move_from = $(this).attr("id");
$.ajax({
type: "POST",
url: "jq_test.php",
data

{move_from: $(this).attr("id")}),
dataType: "html",
async:false,
success: function(msg){
('.a1').html(msg);
}
}).responseText;

});
});
</script>

I receive the error: "a1".html is not a function.

Using this:

<script type="text/javascript">
$(document).ready(function(){
$('.a1').dblclick(function() {
$(this).css("background-color","blue");
move_from = $(this).attr("id");
$.ajax({
type: "POST",
url: "jq_test.php",
data

{move_from: $(this).attr("id")}),
dataType: "html",
async:false,
success: function(msg){
('.a1').html(msg);
}
}).responseText;

});
});
</script>

I receive the correct answers, but the program goes into an infinite loop after displaying the results.

Help and advice, please.

**DanInMA** · 07-06-2011 12:42 PM

thats because you deleted part of the selector. it shoudl be :

Code:

<script type="text/javascript">
$(document).ready(function(){
$('.a1').dblclick(function() {
$(this).css("background-color","blue");
move_from = $(this).attr("id");
$.ajax({
type: "POST",
url: "jq_test.php",
data:move_from,
dataType: "html",
async:false,
success: function(msg){
$(".a1").html(msg);
}
}).responseText; 

});	
});
</script>

** remember to wrap your code in code blocks by clicking on the black hash mark.***

and you keep chaning the code to this for some reason and it doesnt make sense.

Code:

data{move_from: $(this).attr("id")}),

**woofy613** · 07-06-2011 03:30 PM

Thsnks.

How do I "remember to wrap your code in code blocks by clicking on the black hash mark."?

Using your suggested code, the result appears in all the squares with the id of b.

What is desired is to have the result in the $_POST variable w/o any output to the screen. If we have to start w/ screen output to fine tune the code, OK. The output should appear only once on the screen and not in any of the squares.

Thanks again.

**woofy613** · 07-07-2011 11:37 AM

Dan -

Any more ideas? I'm really stuck on this and I'd like to be able to finish.

Thanks ever so much

**woofy613** · 07-07-2011 03:31 PM

To all users of this list -

Does anyone have any ideas how too solve the problem?

Thanks ever so much.

Thread: JavaScript to PHP

Thread Tools

Display

JavaScript to PHP

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions