How to do Simple CRUD Operations in WordPress with Elementor
Vložit
- čas přidán 5. 09. 2024
- Learn how to implement CRUD in WordPress by using the Elementor Pro plugin and writing custom PHP functions that interact with a MySQL database. This allows you to save both Elementor and custom form data to a database in WordPress. After designing a simple web page, this tutorial will teach you how to create, read, update, and delete records right from the web page in the form of a table. This works for both local and remote PHP APIs and databases.
Please understand that this is just a demonstration of how CRUD works and should not be used in a live website since we have not sanitized the user input.
Get the Elementor Pro plugin 👉 ttt.do/Element... (affiliate link)
Code snippets and more at tonyteaches.te...
Check out my vlog channel @TonyFlorida
#wordpress #crud #php #elementor
Met a backend web developer at a restaurant today and he suggested elements for php in WordPress. I've only done frontend web design, and I'm working on learning python rn.
Thank you for making this! It's my introduction to WordPress, elements, and php.
Happy to help!
Another awesome CRUD movie from Tony, well done, I enjoyed them both. I am learning to code again after many years. You sped up the learning curve. Keep up the good work. cheers John
Glad you enjoyed it. Good luck with getting back into coding!
Thank you so much brother. Can you make more videos like this one. On how to implement crud, ajax with elementor.
Thanks, I will try
Wow! That's is what I asked for. I am so impressed with what you just taught me.
Glad it was helpful M J!
I will love more videos like this.
Sure thing Ishmael
Hello Tony enjoyed your video v much. Question: if there are more 1 elementor form "add" buttons, how does the hook in the child theme tell the difference between different elementor form data posts?
your workspace is awesome, and I learnt alot of from this, thanks!
I appreciate that Stanley!
Best tutorial ever! ..... Keep going!
How do we make it so that people can only CRUD their own records?
Thanks! That's a bit more complicated and would involve some type of user authentication
Good beginners guide. Thanks. Can you show how to populate a drop-down selection with a database column contents.
why did u not just use wpdb global variable, i came here to learn that
very nice Tony you are really so simple
Thank you kindly
Amazing! Thanks for this tutorial.
You're very welcome!
Very nice tutorial mate.
Many thanks!
Useful video that im looking for. I have a question. How do I pass warning or any other massage to the view page after the form submitted. Thanks
Hi Tony I am having a lot of trouble getting the data to show up in my table. I am pretty sure something is wrong. I am using php my admin and have followed the steps I can only imagine I have got something wrong with the database name or something. Can you help?
Thanks Tony for this great video!! I was trying out on a localhost installed on windows 10 but was stucked with linking the php files properly. Like "include '/var/www/db.php';", I changed it to "../db.php".
That will work just fine
Would be perfect with edit option =) maybe user roles? user may add / admin may edit / and super admin may delete =) thanks for your tutorials
Please see 28:43 for edit (I call it update in the video)
When integrating user roles, it gets a bit more complicated. I'll leave that for another video :)
Hi Tony, this is good practice and real time but what i'm thingking right now is where is the wordpress function we need ? i mean if we doing this way, wordpress is just for create a form where is built using elementor so conclusion, we can create this tutorial without a wordpress instead simple form html and php. but once again your tutorial is great ...thanks
Yes of course. I have a very similar tutorial without needing WordPress czcams.com/video/3isdcAEZoq0/video.html
Great video! Could you also show us how to do CRUD using the built in phpmyadmin database for Wordpress?
Very similar steps... only difference is that you would execute the MySQL commands within phpmyadmin
I create the folder Api and the PHP file "create.php" but the server respond with 404 error and the message: {"success":true,"data":{"message":"","data":[]}}. Why?
Can you please : 1. How do I allow user to change variable values ? 2. How do I perform calculations ?
Thank you for the suggestions
Very useful example. How can we search and display data based upon the user input?
I will have to suggest that you research online for examples of how to do that
Thx for the great tutorial!! One question: Is there a major advantage to insert the data like this compared to your other tutorial: "How to Save Elementor Form Data to Your Database"??
Thanks a lot! 🙂
If you need to update and/or delete data, then this method would be a better choice for you
@@TonyTeachesTech Thank you soo much for the answer! I only thing is that I'm not able to get it working on my siteground page. Even the support wasn't finding a solution 🙈
Hi thanks for the video. Do you have a video of Master details tables
No, I don't
Seems great, I've tried the same on a hostinger server and the result was not as expected, I couldn't even create the record on the data base, I might be doing something wrong but not sure what it is, i've changed on db.php localhost for the ip and on creat.php I've put the domain with www. still no result. What should I keep in mind when changing from localhost to live server?
Awesome thanks alot for this tutorial. How would we allow only that user to change their score and not others. How do we incorporate user privileges.
That gets much more complicated than what we do in this video
Hi Tony
Great tutorial... Question though. If I have a couple pages that do the Create step, how does the Add button know what function to call in my theme's functions.php file? Say I have a form to add people and I have a form to add teams. What ties the add_action( 'elementor_pro/forms/new_record', function( $record, $handler ) to which form?
Do we need to have Elementor Pro to make this app CRUD on the page?
Hopefully he will answer. I'm basically looking for a solution like that too
Love the video. Here is what I'm trying to do and maybe you could please either make a video or give me advice.
I have an app that saves the user's data to a MySQL database via a rest endpoint. I would like for the user to be able to view the data on my WordPress site.
I need the user to register and sign-in, then be directed to a page that shows the user's data.
What is the best way with WordPress and Element or (both free versions)?
That will require a good amount of custom written code (especially if you want to use it in production since we would be dealing with sign ups and authentication). I can consider making a tutorial in the future on this topic, but it won't be anytime soon.
I have question about the read or select data from database part of the video, What if those data will be displayed in a select box or a dropdown according to the current user. is it possible to implement with that kind of structure ?
Yeah sure. This is where json is helpful because you can pack your list data in a json object. Another option is to simply delimit your data with commas and then parse it
Thank you so much Tony,
My challenge here is using the already existing wordpress class 'global $wpdb;' to connect to my database instead of creating a db.php file. How do I go about that?
THank you
You might be able to pull that off in your functions.php file in WordPress
Javascript script will not show data from database. Looks like the read() function address is wrong. Had to change it from "api/read.php" to "wordpress/api/read.php"
👌
pode me ajudar a fazer estas configurações com um site ja publicado na internet
Hey! what happens to the id if you delete a row, does all the items in the database adjusts or is it just gone and the increment continues. and how does that affect the code when you get the id from the table with UPDATE and DELETE?
The auto increment will continue. Since you are querying the existing rows only, there will be no difference in performance after deleting a row or rows
Hey, great content but setting up ssh connections and MySQL connections for super nerds is a bit complex. What if the same tutorial with no terminal involved. lol . something based on PHPmyadmin.. and PHP snippets. Thanks.
You can execute these same MySQL commands in phpmyadmin!
What a great content! What if I would like to make a submit from using the database. For example, I build a 100 countries list with lat/long value in the database. While customer select the specific country name, the lat/long data will be sent to another app through the webhook function in Elementor. How to make it work?
Sounds like it's possible to do that. You'll have to do some research to make it work
thanks good video, if I need to do it on my own wordpress server? what do i replace this with? wp_remote_post
Hi again, if you wanted to validate a field say you had the form prompt for userid, where would you put the validation for valid userid? where is the best place for this type of validation? cheers John
You can do some basic JavaScript validation before the form is submitted on the client side (things like checking to see if the format looks okay, it's not too long, too short, etc) and then on the server side in PHP you can do the heavier input validation
not working for me could you helo me out ?
Hi Tony! Is the Forms API available only to elementor pro? Cause in the function header it indicates "add_action( 'elementor_pro..." and when i change it to just 'elementor' it does not work. Is there any way I can use the Forms API without upgrading to pro?
The Forms API is only available in Elementor Pro developers.elementor.com/elementor-pro-apis/
It's Jan 2024 and it looks like this CRUD doesn't work anymore. Maybe the latest version of elementor has broken something but from 19 minutes onwards it doesn't work now. Pity.
Just asking cause i used your video to create a little website to manage an inventory and its working well, thanks
But can we add a form to the read.php that will redirect to read.php so that we can search an element in all the records.
Ex : I've 50 people with an id and if i enter the id 34 i'll have the information of only this person, or of I type teacher i'll have all the teacher of this list ...
I've tried it in an external php file and its working but when i try to add it to the read.php the value entered is seen on the url bar but can't be isset or !empty
Should I change the getReadUrl in the elementor editing ?
Hi again, I am using Hostinger as my hosting provider, I was wondering how do you create those .php files if the website is not hosted locally?
I'm sorry this is a stupid question, of course I can do that at my hosting provider's file manager.
You can make these PHP files with an FTP file manager. Not sure if Hostinger has this built-in. If not, you can use a program like Cyberduck to connect to your website server
@@TonyTeachesTech noted. Thanks a lot!
Hi Tony - great video. How would I create a form (or forms) that adds a record to a database in the context of a user and then allows an admin to perform CRUD operations on those records?
This is a harder problem that involves authentication, usernames, passwords, etc. I don't have any tutorial on that
Hi Tony, the form data is not passed on to the database. i get message "Server error. Form not sent.
Email Server error. Form not sent.
This Message is not visible for site visitors." Need help"
Are you online? Sounds like your having issues with the email not being sent AND the form data not being sent.
Hello Tony, really neat stuff.
I have a problem with the create.php file. When i click on the "Add" button it just doesn't trigger writing the data in the db. You have any advice how to debug the problem? The read.php is getting the db and writing the stuff down in the html shortcode (when i put data manually). Instead of "name" and "score" I'm trying to pass the value of a "select" form type and write it into a enum.
This could be a syntax error. If you use Google Chrome, you can go to View > Developer > Developer Tools and at the bottom you'll see a Console window that will show errors. The shortcoming here is that this won't show errors in your PHP code. For that, copy and paste your create.php code here phpcodechecker.com/ to check it
@@TonyTeachesTech I've solved it by doing it again, this time excatly like yours and then i modified it to my needs so I guess it was a syntax error yes. Thanks so much.
Now I'm trying to read that data somehow with a GET request. I'm doing it for a UNI project and Arduino should get the data from either the database or from the site directly. Tried a couple of things but not working ATM. If u have any solutions on the top of your head it would be helpful, but either way you already helped so much.
Much love
Do you have this complete CRUD Project local host?
Or on github?
looks so simple until i tried 😁
I just don't understand why you put the db.php one level up. I mean, you are completely right to do that. But your wp-config.php still at the website root level. So, why move db.php to keep safe if the file that access the main db, still at the root level? Also, why create a new database if you could use the WordPress database that you already have and just create a new table? Sorry to make lot of questions. Thanks!
To your point, wp-config.php should also be outside of the website root as well.
There are many different ways to accomplish the same thing, and in this case I chose to create a new database. Another option as you pointed out is to add a table to the existing WordPress database. Either method is fine :)
@@TonyTeachesTech i see. Thank you for answer!
How could I do the same but connecting to an external database (mysql)?
Instead of localhost, put the IP or domain name of the external database
Ty
You're welcome Andrea
Hey brother, thanks for the video, but I'm having issue inserting the data into the database. I am using a localhost on my machine (localhost:8080), I'm not sure if I need to add the :8080 or just the localhost. My database is on my root directory of my WordPress, it name (db.php). I can seem to connect things together please help me. I need help connecting the wp_remote_post, the database and the create.
how to make table data lookup with elementor
Can we Install wordpress with MongoDB ? if yes, How?
I'm not sure, I have never done that before
Why you don't make database using php my admin?
I did not have phpmyadmin installed in this case, but that is an option
will this work with MongoDB also??
Yes probably with a slightly different implementation
@@TonyTeachesTech Can you Connect with me and help me with this. I working on a project and stuck for a long time around 2 weeks... Please help me Brother.
@@pawanmaurya7146 Sorry, I am not taking on any new clients at this time. If there is a specific question, I can do my best to point you in the right direction though
Boa tarde alguém pode me ajudar?
heyyyyyy
Hey!
There are 1,000 ways to build a lightbulb but only one that works. This is way too complicated for what I want. I want a simple and easy plugin that will allow me to do all the CRUD stuff without having to manually create the DB and SQL files. If I had the access to the server-side (which I do), the last thing I want to do is get in there and screw around with a database for practice or anything else. Elementor is NOT my choice to do anything with. There must be another way!
Not that I'm aware of at this point at least
@@TonyTeachesTech Sir, will these same methods be used for plugin crud operation?