Form_Ajax.php =>
<script type="text/javascript" src="Testing_Ajax.js"></script>
<script type="text/javascript" src="jquery-1.5.js"></script>
<script type="text/javascript" src="myjquery.js"></script>
<style>
.cls_display{
background-color: green;
}
</style>
<form name="nm_form" method="POST" action="Display_Ajax.php">
<table>
<tr><td>User Name:</td><td><input type="text" name="nm_username" id="id_username"/></td></tr>
<tr><td>Password:</td><td><input type="text" name="nm_password" id="id_password"/></td></tr>
<tr><td><input type="button" value="Submitrunajax" onclick="runAjax()"/></td></tr>
<tr><td><input type="button" class="cls_post" value="Submitjqueryajax"/></td></tr>
<tr><td><input type="submit" class="cls_post" value="SubmitPOST"/></td></tr>
</table>
<div id="id_display" class="cls_display">
</div>
</form>
Display_Ajax.php =>
<?php
class Display_Ajax{
public function __construct(){
}
public function printall(){
$var_username=$_POST["nm_username"];
$var_password=$_POST["nm_password"];
echo $var_username.'<br>';
echo $var_password.'<br>';
}
}
$var_obj=new Display_Ajax();
$var_obj->printall();
?>
myjquery.js =>
$(document).ready(function(){
$("div").addClass('cls_display');
$("input.cls_post").click(function(){
var temp1,temp2;
temp1=$("#id_username").val();
temp2=$("#id_password").val();
/*
$.post("Display_Ajax.php",{nm_username: temp1, nm_password: temp2},function(prm){
alert(prm);
$("div.cls_display").html(prm);
});
*/
$.ajax({
type: "POST",
url: "Display_Ajax.php",
data: "nm_username="+temp1+"&"+"nm_password="+temp2,
success: function(prm){
alert(prm);
$("div.cls_display").html(prm);
}
});
});
});
http://localhost/Form_Ajax.php , clicking the third submit button i got the value.
<tr><td><input type="submit" class="cls_post" value="SubmitPOST"/></td></tr>
But from Firefox>Tools>Error Console i got error =>
Firebug's log limit has been reached. 0 entries not shown. Preferences
uncaught exception: [Exception... "Component returned failure code: 0x80040111 (NS_ERROR_NOT_AVAILABLE) [nsIXMLHttpRequest.getAllResponseHeaders]" nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)" location: "JS frame :: http://localhost/jquery-1.5.js :: anonymous :: line 7207" data: no]
Try changing your data area from:
data:"nm_username="+temp1+"&"+"nm_password="+temp2
to:
data: {nm_username : temp1,nm_password : temp2},
See if that works.
Read down on this page: http://api.jquery.com/jQuery.ajax/
User contributions licensed under CC BY-SA 3.0