Jquery -> $.post == Result Messes Up Table.

[notsophpfreakish]

The form wants the user to input a display name.

 

The goal is to check via the jquery $.POST function to send back to this page to check to see if the display name is available.

 

 

This is the table on the registration page.

<table border = '1'>
<form id = 'register' action = '#' method = 'post'>
<tr><td width = '150'>Display: </td><td width = '200'><input id = 'display' type = 'text' name = 'display' maxlength = '35'></td><td id = 'displaycheck' align = 'center' width = '80'>
<?php
if(isset($_POST['display']))
{
$display = htmlspecialchars($_POST['display']);
$display = mysql_real_escape_string($display);

$result = mysql_query("SELECT display FROM user WHERE display = '$display' ");
$count = mysql_num_rows($result);
if($count == 1)
{
echo "<font color = 'red'>Taken.</font>";
}
else
{
echo "<font color = 'green'>Accepted.</font>";
}

}
?>
</td></tr></table>

 

 

 

This is the Jquery Code:

 

$(document).ready(
function ()
{
//Display
 $('#display').focusin( function() {
  $('#directions').html('For your display name, you can have up to 35 characters which includes letters, numbers, underscores, periods, and spaces.');
 });

 $('#display').keyup( function() {

  var display = $(this).val();
  $.post('/registration.php', {display: display}, function(data) {
  $('#displaycheck').html(data);
  });
 });
);
});

 

 

What's happening is the ENTIRE table is reprinted in the table CELL 'displaycheck'. I have NO idea why the entire table is being resent. Can someone pelase help?? I haven't got a clue on how to fix this.

Edited December 10, 2012 by notsophpfreakish

[MDCode]

$.post submits data, so by doing it to registration.php and returning html, all html page will be displayed where you set it, in your case you set it to #displaycheck

 

 

// submits to registration.php
$.post('/registration.php', {display: display}, function(data) {

// returns all html on registration.php to the div with id of displaycheck
$('#displaycheck').html(data);

[notsophpfreakish]

Ah, that explains it. Now that I think back, I had 'text' there and the entire file was put into the table cell.

 

So, if that's the case, what do I use instead? (I'm very new at javascript and jquery! :-( )

[MDCode]

I would make a separate php file. Submit the data to it and check on there, echo out anything you need because that is considered html.

 

 

otherpage.php

<?php
echo "jquery ftw";
?>

 

jquery:

// submit to other page
$.post('/otherpage.php', {display: display}, function(data) {

// will display jquery ftw in the displaycheck div
$('#displaycheck').html(data);

[notsophpfreakish]

Life saver!! thank you!!