I have a form that is a
chat apps am building
for project. Now
everything seems to be
working fine to best of
my ability.
Now i want to submit
the data from the form
into my php script
without any form of
reload. That means i
don't want redirection
to the action page and
back to the chat page.
What i want is for the
page to submit the
form at the background.
And i know i need ajax
to this bt i cnt get it
right. Here is my form

<form method="post"
<input type="text"
<input type='hidden'
id='user_id' name='id'
<input type='hidden'
id='user_name' name='id'
<input type='submit'
id='submit' name='chat'
What i need is an ajax
code to submit d
variable to the reply.php
scrit and maybe a
message to display
when the form it been
submitted say
something like
(sending...). Thanks for


I will provide prototype example: Form Code

<form name="frmcontact" id="frmcontact" method="post">
  <p>First Name:
    <input name="fname" type="text" id="fname" placeholder="First Name" />
  <p>Last Name:
    <input name="lname" type="text" id="lname" placeholder ="Last Name" />
    <input name="email" type="text" id="email" placeholder="Email" />
    <textarea name="comments" id="comments" placeholder="Comments" class="txtarea"></textarea>
  <a href="javascript:void(0);" id="submit" class="btn1 left">Submit</a>

Javascript function to submit form:

<script type="text/javascript">
$(document).ready(function() {
    $("#submit").click( function() {
        //alert('New Registration');

        var url = 'formpost.php';
        var frmdata = $("#frmcontact").serialize() ;
            url: url,
            dataType: 'json',
            type: 'POST',
            data: frmdata,
            success: function(response) {
                    alert(response); // For test
                    if( response.status == 'Y' ) {
                        $("#div_form").html('<h2>Your request is submitted successfully./h2>');

                    else {
                        $("#div_form").html('<h2>Error in process. Please try later.</h2>');


/*** End document ready **/

Sample of formpost.php

$response = array();
// Do some Mail Procedure

If mail( .. ) {
    $response['status'] = 'Y';
else {
    $response['status'] = 'N';


Please Note:

  1. All input fields have ID and Name (Required)
  2. <form> did not require action tag
  3. Did not use submit button. (Submit button try submit the form as a result page get refresh.
  4. var frmdata = $("#frmcontact").serialize() get all from data have name=>value pair
  5. Please include jQuery.

Please check and let me know.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.