Question

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]

Answer 1

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/