Mini Project On Multi User CRUD Operations(Create, Read, Update & Delete) Of Donar Details Of Indian Nationals Who Donate To Ramkrishna Math, Belur Math Using PDO (PHP Data Objects) With Proper Explanation Of Each And Every Individual Line Of The Code Of connection.php Page, form.php Page, formaction.php Page, admin_display.php Page, client_display.php Page, edit.php Page, editaction.php Page And delet.php Page (Here You Will Find The Image Of Sayang Sri Ramkrishna Dev, Sayang Sri Ma Sarada Devi & Sayang Sri Swami Vivekananda) In My CRUD Operation
Mini Project On Multi User CRUD Operations(Create, Read, Update & Delete) Of Donar Details Of Indian Nationals Who Donate To Ramkrishna Math, Belur Math Using PDO (PHP Data Objects) With Proper Explanation Of Each And Every Individual Line Of The Code Of connection.php Page, form.php Page, formaction.php Page, admin_display.php Page, client_display.php Page, edit.php Page, editaction.php Page And delete.php Page (Here You Will Find The Image Of Sayang Sri Ramkrishna Dev, Sayang Sri Ma Sarada Devi & Sayang Sri Swami Vivekananda) In My CRUD Operation
So,firstly I am going to explain about the connection page (connection.php).Let's begin.
In connection.php page first I have taken ($servername="localhost";) where $servername is the name of the server with which we are actually wanting to connect. Now coming to ($username="root";) where $username is the name of the user which and I already know that server has definitely a user, and that user exists in which server name. Now coming to ($password="";) where $password is blank. Now you may ask me why the $password field is blank? Let me explain the reason. $password field is blank as because in Windows by default the password is blank and that's why in password field I have kept as blank. Now coming to ($db="home_practise") where $db is the database name and it differs continuosly because in database whathever database name I will provide either it's home_practise or php laravel web development batch nov 2024 or xyz that name only I need to take in $db in connection.php page. Now coming to try and catch portion of connection.php page where try is used to send an exception which means within try block it sends an exception error whereas within catch block it handles the exception error which exception error is send by the try block. Like if I make any mistake in $servername or $username or $password or $db then in out output page the connection failure will be shown to me. For example:
I have made the changes in $servername="localhost" to $servername="localhost1". My " Connection Failure SQLSTATE[HY000] [2002] php_network_getaddresses: getaddrinfo for localhost1 failed: No such host is known." will directly be shown in the output page as I have shown in the image below.
$servername="localhost1";
Suppose now I have made the changes in $username="root" to $username="root123". My " Connection Failure SQLSTATE[HY000] [1045] Access denied for user 'root123'@'localhost' (using password: NO)" will directly be shown in the output page as I have shown in the image below.
$username="root123";
Suppose now I have made the changes in $password="" to $password="abc". My " Connection Failure SQLSTATE[HY000] [1045] Access denied for user 'root'@'localhost' (using password: YES)" will directly be shown in the output page as I have shown in the image below.
$password="abc";
Suppose now I have made the changes in $db="home_practise" to $db="home_practise@1". My " Connection Failure SQLSTATE[HY000] [1049] Unknown database 'home_practise@1'" will directly be shown in the output page as I have shown in the image below.
$db="home_practise@1";
So, with this I am completing my explanation of connection.php page. Stay tuned for form.php page coming below.
connection.php =>
<?php
$servername="localhost";
$username="root";
$password="";
$db="home_practise";
try{
$conn=new PDO("mysql:host={$servername};dbname={$db}",$username,$password);
}
catch(PDOException $e){
echo "Connection Failure ".$e->getMessage();
}
?>
Output Of connection.php =>
Now coming to my form.php page explanation. So, here in my form.php page firstly I have taken one div whose class name I have given as container. Now you may ask me why I have taken the class name as container only I can take any other class name. It's a very good question. I have taken the class name as container as because container class name is the bootstrap class name. Then I have taken another div where within that div I have used h1 heading where within h1 heading I have writeen "Ramkrishna Math, Belur Math" and within that div I have also taken the image of Belur Math with a height of 250px and width of 500px. After that I have taken the image of Sri Ramkrishna, Sri Sarada Devi, Swami Vivekananda, Monastic Disciples And Lay Disciples with a height of 260px and a width of 260px. Then I have taken one header whose class name I have provided as modal header. And then within that header I have taken heading 2 and within that heading 2 I have written "Donar Details Registration Form". Then I have taken one form and within that form I have taken the method as post as because post method is the most secure method and post method cannot sent the query string, then within form I have taken action as formaction.php and enctype="multipart/form-data" for image as because image is a file type and as I know that I can convert the normal text type in to binary but file type cannot be converted into binary, so to convert file type into binary I have taken enctype="multipart/form-data" where enctype is the encrypt type, so to convert the file type into binary first I need to encrypt the file. That's why I have taken enctype="multipart/form-data". Then within form I have taken autocomplete=off. You may ask me why I have taken autocomplete=off? Very good question. Let me exp-lain this. I have used autocomplete=off as because while I will type the letters into onkeyup the form will automatically gets submitted if my autocomplete is in on state. So to avoid the autosubmit I have used autocomplete=off.Then I have taken one div whose class name I have provided as form-group and then I have taken the required class as form-control and onkeyup as the function name for javascript validation of of First Name, Last Name, Email, Mobile, Address and then I have taken another div as id as errorFirstName, ErrorLastname, errorEmail, errorMobile, errorAddress and class name as text-danger within form-group class div and for other fields I have normally used. Then I have provided the styling in css of a1 class, modal-header class and container class. Then I have used script of javascript type where within that script type I have called the function of First name, Last Name, Email, Mobile and Address for javascript validation. For First Name I have used "The first name cannot be a number and the number should range between min. 3 chars longs to max. 10 chars long..." which means in first name if I type my name only Ay it will show me below first name this error prompt "The first name cannot be a number and the number should range between min. 3 chars longs to max. 10 chars long..." if I provide any number within my first name then also it will show me "The first name cannot be a number and the number should range between min. 3 chars longs to max. 10 chars long..." so my first name should be minimum 3 chars long and no number can be used. So if I type Aya then it will not show me the error prompt below my first name as because I have fullfilled minimum 3 chars long. And in this way it will continue same for Last Name, so firstly I have taken one variable which I have print the value as document.getElementById.value. And then I have taken the regex for First Name, Last Name, Email, Mobile and Address. and then I have tested the variable of First Name, Last Name, Email, Mobile and Address with regex of First Name, Last Name, Email, Mobile and Address within if condition for First Name, Last Name, Email, Mobile and Address and then I have print as document.getElementById.innerHTML and document.getElementById.disabled as false and document.getElementById.disabled as true. Now you may ask me why I have used document.getElementById.disabled as false and document.getElementById.disabled as true? Very good question. I have used document.getElementById.disabled as false as because once I type correctly for First Name, Last Name, Email, Mobile and Address my prompt error will not show and it will allow me to submit and I have used document.getElementById.disabled as true as because once I type incorrectly for First Name, Last Name, Email, Mobile and Address my prompt error will show and it will not allow me to submit. So, with this I am completing my explanation of form.php page. Stay tuned for formaction.php page coming below.
form.php =>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Donor Details Registration Form</title>
<style type="text/css">
.a1{
text-align: center;
}
.modal-header{
text-align: center;
}
.container{
color: indigo;
background-color: lightblue;
}
</style>
<script type="text/javascript">
function firstnameValid(){
var firstname=document.getElementById('first_name').value;
var firstnameRegex=/^[a-zA-Z ]{3,10}$/;
if (firstnameRegex.test(firstname)) {
document.getElementById("errorFirstName").innerHTML="";
document.getElementById("submitBtn").disabled=false;
}
else{
document.getElementById("errorFirstName").innerHTML="The first name cannot be a number and the number should range between min. 3 chars longs to max. 10 chars long...";
document.getElementById("submitBtn").disabled=true;
}
}
function lastnameValid(){
var lastname=document.getElementById('last_name').value;
var lastnameRegex=/^[a-zA-Z ]{3,20}$/;
if (lastnameRegex.test(lastname)) {
document.getElementById("errorLastName").innerHTML="";
document.getElementById("submitBtn").disabled=false;
}
else{
document.getElementById("errorLastName").innerHTML="The last name cannot be a number and the number should range between min. 3 chars longs to max. 20 chars long...";
document.getElementById("submitBtn").disabled=true;
}
}
function emailValid(){
var email=document.getElementById('email').value;
var emailRegex=/^[a-z0-9._-]+@[a-z0-9.]+\.[a-z]{2,3}$/;
if (emailRegex.test(email)) {
document.getElementById("errorEmail").innerHTML="";
document.getElementById("submitBtn").disabled=false;
}
else{
document.getElementById("errorEmail").innerHTML="Please enter a valid email id...";
document.getElementById("submitBtn").disabled=true;
}
}
function mobileValid(){
var mobile=document.getElementById('mobile').value;
var mobileRegex=/^[9876][0-9]{9}$/;
if (mobileRegex.test(mobile)) {
document.getElementById("errorMobile").innerHTML="";
document.getElementById("submitBtn").disabled=false;
}
else{
document.getElementById("errorMobile").innerHTML="Please enter a valid mobile no...";
document.getElementById("submitBtn").disabled=true;
}
}
function addressValid(){
var address=document.getElementById('address').value;
var addressRegex=/^[A-Za-z/,0-9- ]{5,80}$/;
if (addressRegex.test(address)) {
document.getElementById("errorAddress").innerHTML="";
document.getElementById("submitBtn").disabled=false;
}
else{
document.getElementById("errorAddress").innerHTML="Please enter a valid address which range between min. 5 chars long to max. 80 chars long...";
document.getElementById("submitBtn").disabled=true;
}
}
</script>
</head>
<body>
<div class="container">
<div class="a1">
<h1>Ramkrishna Math, Belur Math</h1>
<img src="https://live.staticflickr.com/65535/51595955925_bd95a72b6e_h.jpg" height="250px" width="500px"><br>
</div>
<img src="https://live.staticflickr.com/65535/53677987068_8c8477e862_c_d.jpg" height="260px" width="260px">
<img src="https://live.staticflickr.com/65535/53678220115_f6379a1d2a_c_d.jpg" height="260px" width="260px">
<img src="https://live.staticflickr.com/65535/53677766551_6166cf2fa2_c_d.jpg" height="260px" width="260px">
<img src="https://live.staticflickr.com/65535/53678122599_dafd5976d9_c_d.jpg" height="260px" width="260px">
<img src="https://live.staticflickr.com/65535/53677766576_54d41b5e11_c_d.jpg" height="260px" width="260px">
<header class="modal-header"><h2>Donor Details Registration Form</h2></header>
<form method="post" action="formaction.php" enctype="multipart/form-data" autocomplete="off">
<div class="form-group">
First Name: <input type="text" name="first_name" id="first_name" required class="form-control" onkeyup="firstnameValid()">
<div id="errorFirstName" class="text-danger"></div>
</div>
<div class="form-group">
Last Name: <input type="text" name="last_name" id="last_name" required class="form-control" onkeyup="lastnameValid()">
<div id="errorLastName" class="text-danger"></div>
</div>
<div class="form-group">
Email: <input type="email" name="email" id="email" required class="form-control" onkeyup="emailValid()">
<div id="errorEmail" class="text-danger"></div>
</div>
<div class="form-group">
Mobile: <input type="number" name="mobile" id="mobile" required class="form-control" onkeyup="mobileValid()">
<div id="errorMobile" class="text-danger"></div>
</div>
PAN Number: <input type="text" name="pan_number"><br>
Aadhaar Number: <input type="number" name="aadhaar_number"><br>
Message from the donar: <input type="text" name="message"><br>
<div class="form-group">
Address: <input type="text" name="address" id="address" required class="form-control" onkeyup="addressValid()">
<div id="errorAddress" class="text-danger"></div>
</div>
City: <input type="text" name="city"><br>
State_Province: <select name="state_province">
<option value="">Select</option>
<option value="Andaman and Nicober Islands">Andaman and Nicober Islands</option>
<option value="Andhra Pradesh">Andhra Pradesh</option>
<option value="Arunachal Pradesh">Arunachal Pradesh</option>
<option value="West Bengal">West Bengal</option>
<option value="Tripura">Tripura</option>
</select><br>
Pincode: <input type="text" name="pincode"><br>
Country: <select name="country">
<option value="">Select</option>
<option value="Argentina">Argentina</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="India">India</option>
<option value="Germany">Germany</option>
</select><br>
Image: <input type="file" name="image"><br>
<button class="btn" id="submitBtn">Donate</button>
</form>
</div>
</body>
</html>
Now coming to my formaction.php page explanation. First in my formaction.php page I have include my connection.php. Now you may ask me why I have include connection.php page here in formaction.php page? It's really a nice question. I have used connection.php page here in formaction.php page because if I don't include my connection.php page in formaction.php page then I need to write the connection.php page in formaction.php page and not only in formaction.php page in all the other pages also I need to write the connection.php page. That's why I need to include the connection.php page in formaction.php page as well as in all other pages. Then I have put the values using $_REQUEST. and print the values using echo. Now you may ask me why I am using echo to print and check the output, I can check the output later also after completing the formaction.php page. No, this is the wrong concept. I should follow the proper procedure. If I print and the output after writting few lines then it will be very easier for me that where I have made the mistake if any error comes. But after writting the full code of several lines if I check the output and if any error comes at that time, it will be very difficult for me to identify which line I have made the mistake and which line I have made the error.
Output Of JavaScript Validation of form.php page =>
Now I have prepared a table named "Belur_Math" along with the input fields as shown in the image below by me for Multi User PDO CRUD Operation. After creating the table in database, I have clicked on Save. Here I have taken two extra fields in my table one is user_type which consists of admin and client and another one is auth which means authentication which authentication consists of 0 and 1 where 0 is false means in 0 the user doesn't have authentication or access but 1 means true where in 1 the user have authentication or access.
Then I have used Try and Catch Block and within Try Block I have inserted the INSERT INTO Statement in to $sql by copying from the database. Then I have used $query=$conn->prepare($sql) where prepare statement is used to prepare the sql query statement. Then I have called the values using bindparam. So, now you may ask me a very good question, what is the function of bindparam()? bindparam() function is used to bind the variables in a parameter with an SQL statement. Then I have used $data=$query->execute(); where execute() statement is used to execute the sql query statement. Then I have used if condition where I am checking if($data) whether the data is inserted or in else the data is not inserted and then I am using the catch block. After that Once I fill the form it will prompt me as Data Inserted and once I click on OK the data will be inserted in database and then I can view the data in phpmyAdmin database as shown in the image below.
Output Of form.php page =>
Output Of client_display.php page =>
client_display.php page is showing as Not Found as because client_display page is not yet created. Stay tuned for admin_display.php page and client_display.php page coming below.
formaction.php =>
<?php
include("connection.php");
$First_Name=$_REQUEST['first_name'];
$Last_Name=$_REQUEST['last_name'];
$Email=$_REQUEST['email'];
$Mobile=$_REQUEST['mobile'];
$PAN_Number=$_REQUEST['pan_number'];
$Aadhaar_Number=$_REQUEST['aadhaar_number'];
$Message_from_the_donar=$_REQUEST['message'];
$Address=$_REQUEST['address'];
$City=$_REQUEST['city'];
$State_Province=$_REQUEST['state_province'];
$Pincode=$_REQUEST['pincode'];
$Country=$_REQUEST['country'];
$fileName=$_FILES['image']['name'];
$tmpName=$_FILES['image']['tmp_name'];
$folder="uploads/".$fileName;
move_uploaded_file($tmpName, $folder);
// echo $First_Name,$Last_Name,$Email,$Mobile,$PAN_Number,$Aadhaar_Number,$Message_from_the_donar,$Address,$City,$State_Province,$Pincode,$Country,$folder;
try{
$sql="INSERT INTO `belur_math`(`user_id`, `first_name`, `last_name`, `email`, `mobile`, `pan_number`, `aadhaar_number`, `message`, `address`, `city`, `state_province`, `pincode`, `country`, `image`, `user_type`, `auth`) VALUES ('',:fn,:ln,:em,:mo,:pn,:an,:mftd,:add,:ci,:sp,:pc,:ct,:fd,'CLIENT',0)";
$query=$conn->prepare($sql);
$query->bindparam(":fn",$First_Name);
$query->bindparam(":ln",$Last_Name);
$query->bindparam(":em",$Email);
$query->bindparam(":mo",$Mobile);
$query->bindparam(":pn",$PAN_Number);
$query->bindparam(":an",$Aadhaar_Number);
$query->bindparam(":mftd",$Message_from_the_donar);
$query->bindparam(":add",$Address);
$query->bindparam(":ci",$City);
$query->bindparam(":sp",$State_Province);
$query->bindparam(":pc",$Pincode);
$query->bindparam(":ct",$Country);
$query->bindparam(":fd",$folder);
$data=$query->execute();
if ($data) {
echo "<script>alert('Data Inserted')</script>";
echo "<script>window.location.href='admin_display.php'</script>";
}
else{
echo "Data Not Inserted";
}
}
catch(PDOException $e){
echo "Connection Failure ".$e->getMessage();
}
?>
Now coming to admin_display.php page explanation. Here in my admin_display.php page firstly I have included my connection.php page then I have included my SELECT statement WHERE `user_type`='CLIENT' in a sql statement. Then I have used the prepare statement of $sql and then I have used fetch(PDO::FETCH_LAZY) which basically usewd to fetch as an associative array like here instaed of FETCH_ASSOC which I use in Procudural PHP for associative array here in PDO I used FETCH LAZY whose function also works as an associative array and FETCH_LAZY basically combines FETCH_BOTH and FETCH_OBJ both and returns as PDORowObject. Then to print the values and to view in output I have used print_r($result). Now you may ask me a very good question that is why I have used print_r(result) why I haven't used echo "$result". Nice, I have used print_r($result) instead of echo "$result" because as I have used FETCH_LAZY which is an associative array, so for array I can't us echo, I can only use print_r, echo I can use only for string not for array. I will get the output as shown in the image below.
Then I have just copied and paste the form.php page in my edit.php page and I have put the values in each input fields. Here only I make chanes in title from "Donor Details Registration Form" to "Donor Details Update Form" and heading h2 from "Donor Details Registration Form" to "Donor Details Update Form" and action from formaction.php to editaction.php.
And then in my sql query I have provided the UPDATE statement along with `user_id`=:userID; and then I ahve also called the :userID as bindparam() function and then in alert I have make the changes from "Data Inserted" to "Data Updated" and then in try block I have taken one if condition where I am checking that if $folder is == 'uploads/' and then within if condition mysql statement I have taken `image` as '$oldImg' and then in else part I am checking in if condition that if the old image file exists then I need to unlink the old image and in sql statement I should now put `image`='$folder'. Now for user id =3 I have changed the old image and inserted the new image and then my data updated prompt appears and once I click on OK the new image get updated as shown in the image below.
So, with this I am ending the "Mini Project On Multi User CRUD Operations(Create, Read, Update & Delete) Of Donar Details Of Indian Nationals Who Donate To Ramkrishna Math, Belur Math Using PDO (PHP Data Objects) With Proper Explanation Of Each And Every Individual Line Of The Code Of connection.php Page, form.php Page, formaction.php Page, admin_display.php Page, client_display.php Page, edit.php Page, editaction.php Page And delet.php Page (Here You Will Find The Image Of Sayang Sri Ramkrishna Dev, Sayang Sri Ma Sarada Devi & Sayang Sri Swami Vivekananda) In My CRUD Operation ".
Comments
Post a Comment