Ad:

PHP Discussion Thread
Marked Solved
Views: 8655

Feb 26th, 2009

Insert record into db by using ajax post method?

Expand Post »

Hi ...

i need to inserting around 20 values...which method is best in ajax post or get..i dont know abt ajax..plz send me ajax registration or small form (which having inserting records into db) ...i can learn by using this....

Thank u..

Similar Threads

please help with deleting records using checkboxes in PHP

ahmksssv

Reputation Points: 11

Solved Threads: 7

Junior Poster in Training

Offline

84 posts
since Feb 2009

Permalink

Feb 26th, 2009

Re: Insert record into db by using ajax post method?

Here is a simple AJAX form submission using POST. It basically sends the first and last name to the server, and the server outputs the form information and the date on the server. Very simple, but easy to build on.
post.php:

php Syntax (Toggle Plain Text)
<?php
$FirstName = $_POST['FirstName'];
$LastName = $_POST['LastName'];
$today = date("m/d/Y");
//send output back to page.
echo "Hello $FirstName $LastName. Todays date is $today.";
?>
<?php
$FirstName = $_POST['FirstName'];
$LastName = $_POST['LastName'];
$today = date("m/d/Y");
//send output back to page.
echo "Hello $FirstName $LastName. Todays date is $today.";
?>

html file(name it whatever you want):

html Syntax (Toggle Plain Text)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" language="javascript">
   var http_request = false;
   function makePOSTRequest(url, parameters) {
      http_request = false;
      if (window.XMLHttpRequest) { // Mozilla, Safari,...
         http_request = new XMLHttpRequest();
         if (http_request.overrideMimeType) {
         	// set type accordingly to anticipated content type
            //http_request.overrideMimeType('text/xml');
            http_request.overrideMimeType('text/html');
         }
      } else if (window.ActiveXObject) { // IE
         try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
         } catch (e) {
            try {
               http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
         }
      }
      if (!http_request) {
         alert('Cannot create XMLHTTP instance');
         return false;
      }
 
      http_request.onreadystatechange = alertContents;
      http_request.open('POST', url, true);
      http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
      http_request.setRequestHeader("Content-length", parameters.length);
      http_request.setRequestHeader("Connection", "close");
      http_request.send(parameters);
   }
 
   function alertContents() {
      if (http_request.readyState == 4) {
         if (http_request.status == 200) {
            //alert(http_request.responseText);
            result = http_request.responseText;
            document.getElementById('myspan').innerHTML = result;            
         } else {
            alert(http_request.status);
         }
      }
   }
 
   function get(obj) {
      var poststr = "FirstName=" + encodeURI( document.getElementById("FirstName").value ) +
                    "&LastName=" + encodeURI( document.getElementById("LastName").value );
      makePOSTRequest('post.php', poststr);
   }
</script>
</head>
<body>
<form action="javascript:get(document.getElementById('myform'));" name="myform" id="myform">
<input type="text" id="FirstName" />
<input type="text" id="LastName" />
<input type="Submit" value="Submit" />
</form>
<div id="myspan">This area will be filled with the servers output after submit is clicked.</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" language="javascript">
   var http_request = false;
   function makePOSTRequest(url, parameters) {
      http_request = false;
      if (window.XMLHttpRequest) { // Mozilla, Safari,...
         http_request = new XMLHttpRequest();
         if (http_request.overrideMimeType) {
         	// set type accordingly to anticipated content type
            //http_request.overrideMimeType('text/xml');
            http_request.overrideMimeType('text/html');
         }
      } else if (window.ActiveXObject) { // IE
         try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
         } catch (e) {
            try {
               http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
         }
      }
      if (!http_request) {
         alert('Cannot create XMLHTTP instance');
         return false;
      }
      
      http_request.onreadystatechange = alertContents;
      http_request.open('POST', url, true);
      http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
      http_request.setRequestHeader("Content-length", parameters.length);
      http_request.setRequestHeader("Connection", "close");
      http_request.send(parameters);
   }

   function alertContents() {
      if (http_request.readyState == 4) {
         if (http_request.status == 200) {
            //alert(http_request.responseText);
            result = http_request.responseText;
            document.getElementById('myspan').innerHTML = result;            
         } else {
            alert(http_request.status);
         }
      }
   }
   
   function get(obj) {
      var poststr = "FirstName=" + encodeURI( document.getElementById("FirstName").value ) +
                    "&LastName=" + encodeURI( document.getElementById("LastName").value );
      makePOSTRequest('post.php', poststr);
   }
</script>
</head>
<body>
<form action="javascript<b></b>:get(document.getElementById('myform'));" name="myform" id="myform">
<input type="text" id="FirstName" />
<input type="text" id="LastName" />
<input type="Submit" value="Submit" />
</form>
<div id="myspan">This area will be filled with the servers output after submit is clicked.</div>
</body>
</html>

Try it out and study how it works.

Last edited by buddylee17; Feb 26th, 2009 at 10:48 am.

buddylee17

Reputation Points: 232

Solved Threads: 137

Practically a Master Poster

Offline

665 posts
since Nov 2007

Permalink

Feb 27th, 2009

Re: Insert record into db by using ajax post method?

Thank You....
its easy to understand...
is it same for more no.of fields? or is there any other way to send more no.of fields....

ahmksssv

Reputation Points: 11

Solved Threads: 7

Junior Poster in Training

Offline

84 posts
since Feb 2009

Permalink

Feb 27th, 2009

Re: Insert record into db by using ajax post method?

Yes, the same for more fields. Basically, if you add a text field into the form, you'll need to update the javascript variable, postr on line 52 above so that it will send the value to the php file.

Also, for better design, the javascript should be placed in an external .js file (for better organization and so it can be cached) and called from the head of the document.

buddylee17

Reputation Points: 232

Solved Threads: 137

Practically a Master Poster

Offline

665 posts
since Nov 2007

Permalink

Feb 28th, 2009

Re: Insert record into db by using ajax post method?

Click to Expand / Collapse Quote originally posted by buddylee17 ...

Yes, the same for more fields. Basically, if you add a text field into the form, you'll need to update the javascript variable, postr on line 52 above so that it will send the value to the php file.

Also, for better design, the javascript should be placed in an external .js file (for better organization and so it can be cached) and called from the head of the document.

Hi ..

Thank u....i learn a lot from u.....
i cleared my doubt for inserting data....

when i retreiving data from database, how can i get values from php page to html page by using ajax...i mean same concept in reverse formate...

Thank u once again...

ahmksssv

Reputation Points: 11

Solved Threads: 7

Junior Poster in Training

Offline

84 posts
since Feb 2009

Permalink

Mar 8th, 2009

Re: Insert record into db by using ajax post method?

Click to Expand / Collapse Quote originally posted by ahmksssv ...

Hi ..

Thank u....i learn a lot from u.....
i cleared my doubt for inserting data....

when i retreiving data from database, how can i get values from php page to html page by using ajax...i mean same concept in reverse formate...

Thank u once again...

Im kinda more like a beginner at this but i am familliar of using ajax (thanks to marky and the mct team who taught me)

if you try to access the post.php page directly, what prints out in this page is what is forwarded by this script to your page. in short, your page gets the contents of the post.php and display it there.

now to display the data, you must edit the line 52 to meet your query requirements. as soon as this is done, you edit the post.php to get the data and print it on the post.php page. automatically, the script will get the data from the post.php page and displays it to your current page.

example:

you have a page with an item and its button with "get item data" as its value. hidden with that button is a hidden input tag with that item's id. when you click the button, the id is passed to the script which it will then pass to the post.php. then the post.php will display the data you need using that item's id number on the post.php page. then, since its the purpose of ajax, the script will get the data from the post.php page then on to your page.

it's simple as that actually.

fskreuz

Reputation Points: 10

Solved Threads: 1

Newbie Poster

Offline

14 posts
since Feb 2009

This thread is solved

Either the thread starter or a moderator has marked this thread as solved. You can most likely trust the responses and answers given. There is most likely no reason for any further responses to be posted here. If you have a related question, please start a new thread in this forum instead.

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.

Previous Thread in PHP Forum Timeline: Paypal Integration with PHP MySQL

Next Thread in PHP Forum Timeline: Using <select> tag with PHP

DaniWeb Message

Cancel Changes

User Name
Password