Главная » Языки программирования

Ajax POST request with JQuery and PHP — Tutsmake

Содержание
  1. How to Insert Form Data Using jQuery Ajax in PHP MySQL
  2. How to Insert Data to MySQL Database from PHP using jQuery Ajax
  3. Step 1 – Create Database And Table
  4. Step 2 – Create a Database Connection File
  5. Step 3 – Create An Ajax Post Form in PHP
  6. Ajax POST request with JQuery and PHP - Tutsmake.com
  7. Step 4 – Create Ajax Form PHP File
  8. Conclusion
  9. How to Submit Form using Ajax in PHP?
  10. Form Submit using Ajax in PHP MySQL Example
  11. processRegistration.php
  12. Ajax form submission with PHP.
  13. Our PHP file.

How to Insert Form Data Using jQuery Ajax in PHP MySQL

insert data in MySQL db in PHP using jquery ajax without page refresh. In this tutorial, you will learn how to create and submit a simple form in PHP and store from data into MySQL database using jQuery ajax.

And this tutorial also guides on how to send data to MySQL database using AJAX + jQuery + PHP without reloading the whole page and show a client-side validation error message if it has an error in the form.

How to Insert Data to MySQL Database from PHP using jQuery Ajax

  • Step 1 – Create Database And Table
  • Step 2 – Create a Database Connection File
  • Step 3 – Create An Ajax POST Form in PHP
  • Step 4 – Create An Ajax Data Store File

First of all, go to your PHPMyAdmin and create a table name customers with the following fields: name, email, message.

Step 1 – Create Database And Table

First of all, navigate to your phpmyadmin panel and create database and table using the following sql queries:

CREATE DATABASE my_db; CREATE TABLE `customers` ( `id` int(10) UNSIGNED NOT NULL, `name` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL, `email` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL, `message` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL, `created_date` date DEFAULT NULL ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

Step 2 – Create a Database Connection File

In this step, you will create a file name db.php and update the below code into your file.

Читайте также:  Get day using php

The below code is used to create a MySQL database connection in PHP. When you insert form data into MySQL database, there you will include this file:

Step 3 – Create An Ajax Post Form in PHP

In this step, you need to create an ajax form and update the below code into your ajax-form.php file.

     body < font-family: calibri; >.box < margin-bottom: 10px; >.box label < display: inline-block; width: 80px; text-align: right; margin-right: 10px; >.box input, .box textarea < border-radius: 3px; border: 1px solid #ddd; padding: 5px 10px; >.btn-submit 
Ajax POST request with JQuery and PHP - Tutsmake.com

Step 4 – Create Ajax Form PHP File

Now you need to create a new file name store.php and update the below code into your store.php file.

The below code is used to store form data into a MySQL database table name customers. If form successfully submitted to the database, it will return success message otherwise it returns an error.

Conclusion

In this tutorial, you have learned how to create a simple form and store data into a MySQL database without reloading or refreshing the whole web page with client-side validation using jQuery ajax in PHP.

Источник

How to Submit Form using Ajax in PHP?

In this post, we will learn How to Make a Form Submit in ajax PHP. i explained simply step by step How To Use Form Submit using Ajax in PHP & MySQL. Here you will learn how to Form submit to database Using ajax. This tutorial will give you simple example of ajax form submit php mysql Code Example.

I will give you simple Example of How to make a ajax form submit in PHP.

So let’s see bellow example:

Form Submit using Ajax in PHP MySQL Example

Name

Email address

processRegistration.php

That’s it for now. We hope this article helped you to learn how to send AJAX PHP Post requests.

Additionally, read our guide:

  1. Best Way to Remove Public from URL in Laravel
  2. Error After php artisan config:cache In Laravel
  3. Specified Key Was Too Long Error In Laravel
  4. Active Directory Using LDAP in PHP or Laravel
  5. How To Use The Laravel Soft Delete
  6. How To Add Laravel Next Prev Pagination
  7. cURL error 60: SSL certificate problem: unable to get local issuer certificate
  8. Difference Between Factory And Seeders In Laravel
  9. Laravel: Increase Quantity If Product Already Exists In Cart
  10. How To Calculate Age From Birthdate
  11. How to Convert Base64 to Image in PHP
  12. Check If A String Contains A Specific Word In PHP
  13. How To Find Duplicate Records in Database
  14. How To Get Latest Records In Laravel
  15. Laravel Twilio Send SMS Tutorial With Example
  16. How To Pass Laravel URL Parameter
  17. Laravel 9 Resource Controller And Route With Example
  18. Laravel 9 File Upload Tutorial With Example
  19. How To Schedule Tasks In Laravel With Example
  20. Laravel Collection Push() And Put() With Example

Please let us know in the comments if everything worked as expected, your issues, or any questions. If you think this article saved your time & money, please do comment, share, like & subscribe. Thank you in advance 🙂. Keep Smiling! Happy Coding!

Источник

Ajax form submission with PHP.

This is a basic tutorial on how to create an Ajax form that submits POST data to a PHP script. For this example, we will setup two files:

  1. The web page that displays our form.
  2. The PHP script that receives our form data via Ajax.

Note: If you are completely new to the concept of Ajax requests, then you should probably check out my tutorial on Ajax requests with JQuery, as it provides a basic introduction to the topic.

Our example web page, which contains the form and Ajax submission script:

     Your Email Address:

An explanation of the code above:

  1. We created a basic HTML form that allows users to submit their email address. Note that we gave our form element the ID “my_form_id” and that we gave our text field the ID “email”. When you are using JavaScript and JQuery, it is extremely beneficial to give your HTML elements a unique ID, simply because it makes it easier to access them.
  2. We included the JQuery library from the JQuery CDN.
  3. In our custom JavaScript, we place our code inside the document ready function, simply because we do not want our JS to be executed until the page has been properly loaded.
  4. We attach an event handler onto our form element. This event handler will be called whenever the user attempts to submit the form (when they hit enter or click on the submit button). Note how we referenced our form by its ID, which is “my_form_id”.
  5. Once the user has attempted to submit the form, we prevent the default event / behavior from taking place. Remember that the default behavior of a web form is to direct itself to the action URL. When the action URL is not specified (like in our example), it will attempt to submit itself to the current page. We do not want to this happen, as it will reload the page and prevent our Ajax request from being executed.
  6. We grab the value that the user has entered into the email text field (we reference this text field by its ID).
  7. We execute a POST Ajax request to our submission script, which is aptly-named submission.php

If you run the example above, you’ll see that the form is submitted via Ajax and that our JavaScript alerts the output that it received from our PHP script.

Our PHP file.

Our PHP file (we called it submission.php) that processes the form data is pretty straight forward:

 echo 'Received email was: ' . $emailAddress;

Basically, it takes in the POST value that we submitted via Ajax before printing it out. Our Ajax script will receive this output as soon as the request has been completed.

Obviously, your PHP script will probably be a little more complex, as it could be sending an email or inserting data into a database.

Hopefully, this tutorial has pointed you in the right direction!

Источник

Оцените статью
© 2024 Программирование