Well let me explain the code first:
First the user enters the id, the jquery checks the database for the id..if the id exists it fetches the results and displays in the remaining form boxes, if not it displays no id with some styling.
here is the code:
Javascript and html
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#button1").click(function()
{
//remove all the class add the messagebox classes and start fading
$("#msgbox").removeClass().addClass('messagebox').text('Validating....').fadeIn(1000);
//checks if the id exists
$.post("script_3.php",{ id:$('#id').val(),rand:Math.random() } ,function(data)
{
if(data=='yes')//correct id detail
{
$$("#msgbox").fadeTo(200,0.1,function()
{
$(this).html('Logging in.....').addClass('messageboxok').fadeTo(900,1,
function()
{
$.post('script_1.php', { id: $('input[name="id"]', '#myForm').val()
},
function(json) {
$("input[name='title']").val(json.title);
$("input[name='name']").val(json.rno);
}, "json");
});
});
}
else
{
$("#msgbox").fadeTo(200,0.1,function()
{
//add message and change the class of the box and start fading
$(this).html('NO ID...').addClass('messageboxerror').fadeTo(900,1);
});
}
});
return false; //not to post the form physically
});
Html side:
<style type="text/css">
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}
.top {
margin-bottom: 15px;
}
.buttondiv {
margin-top: 10px;
}
.messagebox{
position:absolute;
width:100px;
margin-left:30px;
border:1px solid #c93;
background:#ffc;
padding:3px;
}
.messageboxok{
position:absolute;
width:auto;
margin-left:30px;
border:1px solid #349534;
background:#C9FFCA;
padding:3px;
font-weight:bold;
color:#008000;
}
.messageboxerror{
position:absolute;
width:auto;
margin-left:30px;
border:1px solid #CC0000;
background:#F7CBCA;
padding:3px;
font-weight:bold;
color:#CC0000;
}
</style>
<body>
<form id="myForm" method="post">
id: <input type="text" name="id"/>
<div id="hidden" style="display: none;">
<p>Title:<input type="text" name="title"/></p>
<p>Name:<input type="text" name="rno"/>
</div>
<br/>
<input type="button" id="button1" value ="Get Info"
onclick="document.getElementById('hidden').style.display = '';"/>
<span id="msgbox" style="display:none"></span>
</form>
<div id="age"></div>
</body>
script_3.php
<?php
//connect to DB removed
$id= mysql_real_escape_string($_POST['id']);
$sql="SELECT id FROM parentid WHERE id='".$id."'";
$result=mysql_query($sql);
$row=mysql_fetch_array($result);
if(mysql_num_rows($result)>0)
{
echo "yes";
//now set the session from here if needed
$_SESSION['u_id']=$id;
}
else
echo "no"; //Invalid Login
?>
Well the problem i have is its not going to script_1.php part and it is always displaying no id error even if i enter the correct id.
I there any syntax error in the code??
plzz let me know if u have ant questions.
I think your problem may be
There is no element with the
id='id'