How to add multiple images into database using mysql and php

by | Nov 9, 2024 | Laravel, Laravel 11, PHP

// start multiple image

$stmt = $conn->prepare(“INSERT INTO cat_images (img_url, cat_id) VALUES (?, ?)”);
$stmt->bind_param(“si”, $imagePath, $cat_id);
$uploadedImages = $_FILES[‘images’];

$cat_id = $conn->insert_id;

foreach ($uploadedImages[‘name’] as $key => $value) {
$targetDir = “main-images/galleries/”;
$fileName = basename($uploadedImages[‘name’][$key]);
$targetFilePath = $targetDir . $fileName;
if (file_exists($targetFilePath)) {
echo “Sorry, file already exists.<br>”;
} else {
if (move_uploaded_file($uploadedImages[“tmp_name”][$key], $targetFilePath)) {
$imagePath = $targetFilePath;
$stmt->execute();
echo “The file ” . $fileName . ” has been uploaded successfully.<br>”;
} else {
echo “Sorry, there was an error uploading your file.<br>”;
}
}
}
$stmt->close();
$conn->close();

// end multiple image

How to get the value of selected radio button using jQuery

by | Sep 20, 2024 | Design, PHP, WORDPRESS, Wordpress Design

Just use below code and modified according to your need.

Note: this is very useful for COD and Prepaid charge addition using javascript, jquery, PHP

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>


<br><br><br>
<script>
    $(document).ready(function(){
        $("input[type='radio']").change(function(){
        	var radioValue = $("input[name='payment_method']:checked").val();
            if(radioValue){
                alert("Your are a - " + radioValue);


                	var totl     = parseInt($("#total_amount").val());

		       	var shipping_value = totl ;
		          
		          // alert(pay_method);
		          // console.log(pay_method);

		          if(radioValue !=0)
		               {
		                    $("#pay").hide();

		               		let cod_charge = 50;

		               		var totl = totl + cod_charge;


		                   $("#gttotal").html("<label>Total Amount</label> <input type='text' name='total_amount' value='"+totl+"' readonly>");
		               }

		               

		               else
		               {
		               		$("#gttotal").html("<label>Total Amount</label> <input type='text' name='total_amount' value='"+totl+"' readonly>");
		               }




            }
        });
    });
</script>

<form action="forms.php">
    <h4>Please select your Payment Method.</h4>
    <p> 
        <label><input type="radio" name="payment_method" value="0" checked>Prepaid</label>
        <label><input type="radio" name="payment_method" value="1">COD</label> 
    </p>
   
    <div id="pay">
				<label>Total Amount</label>
				<input type="text" id="total_amount"  name='total_amount'  value="100" readonly>

		</div>

		<div id="gttotal"></div>

	<input type="submit" name="">


</form>

AWS

by | Apr 30, 2024 | PHP

Steps:

AWS

putty
ubuntu

sudo su

apt update

apt install apache2

service apache2 start

service apache2 status

you will see a ubuntu on your ip

(/var/www/html/index.html)

cd /var/www/html/

ls

now you see index.html

now remove this index.html file

rm index.html

ls

install PHP

apt install php

install mysql sever

apt install mysql-server

now open filezilla

use ssh
and username ubuntu

password ppk key

upload file (in my case index2.zip) inside ubuntu folder

now move uploaded zip file into /var/www/html/

mv index2.zip /var/www/html/

cd /var/www/html/

ls
you can see your file here

now install unzip

apt install unzip

now unzip your file

unzip index2.zip

now
cd /etc/apache2/sites-available/

ls

now open
nano 000-default.conf

add your directory name if you have then save

now open mysql

mysql h localhost -u root

now change your db password using below query

ALTER USER ‘root’@localhost’ IDENTIFIED BY ‘BasantMallick’;

here BasantMallick is your password

now login with new password in mysql

now
create database frmscui;

use frmscui;

for importing sql file use below command

first exit from mysql

second move into parent or index file directory

and use below command

mysql -h localhost -u root -p yourdatabase > sqlfilename.sql

then again login into database

after login

use databasename

show tables

Note: for editing in file use nano before filename

Method 2:

Aws Cloud – host php mysql website on aws ec2 in hindi | http to https aws | free ssl

— * Used Commands *–

  1. update apt
    sudo apt-get update
  2. install mysql
    sudo apt-get install mysql-server
  3. mysql secure installation
    sudo mysql_secure_installation
  4. install apache
    sudo apt-get install apache2
  5. install php
    sudo apt-get install php libapache2-mod-php
  6. restart apache
    sudo systemctl restart apache2
  7. install phpmyadmin
    sudo apt-get install phpmyadmin php-mbstring php-gettext
  8. fix if php myadmin not work
    sudo ln -s /etc/phpmyadmin/apache.conf /etc/apache2/conf-available/phpmyadmin.conf
    sudo a2enconf phpmyadmin.conf
    sudo systemctl restart apache2
  9. enable file permission
    sudo chown ubuntu /var/www/html
  10. change phpmyadmin password
    ALTER USER ‘root’@’localhost’ IDENTIFIED WITH mysql_native_password BY ‘new_password’;

Note: https://help.ubuntu.com/community/FilePermissions

ubuntu@ip-172-31-13-220:~$ sudo chown -R www-data:www-data Netrika/

ubuntu@ip-172-31-13-220:~$ ls -ilah

How to Display Fields in a Single Column on Mobile – WPForms

by | Feb 2, 2024 | PHP, WORDPRESS

Certainly! If you want to convert a multi-column form layout to a single column when viewed on mobile, follow these steps using WPForms:

  1. Creating a Multi-Column Form Layout:
    • Start by creating a form with multiple columns. For example, let’s create a two-column layout using the CSS class wpforms-one-half.
    • The first field in each row should also use the wpforms-first class to indicate that it starts a new row.
  2. Displaying Fields in a Single Column on Mobile:
    • In the form builder, click on a field to display the Field Options.
    • Under the Advanced section, add the wpforms-mobile-full class to the CSS Classes field.
    • Repeat this for other fields in the form.
    • Don’t forget to click the Save button to keep the changes.

Now, when mobile visitors access your form, the multi-column layout will be shown as a single column. Your forms will look professional and user-friendly on smaller screens! 📱

How to show two columns on Contact Form 7

How to show two columns on Contact Form 7

by | Oct 24, 2023 | PHP, WORDPRESS, Wordpress Design

I’ve wrote about creating a two column form in Contact form 7. Now in this tutorial we will see on how to produce a responsive two column form. The form will be in two columns in bigger screens and will come one column in mobile devices. Our final form will look like the following.

How to show two columns on Contact Form 7

you just follow below simple steps:

Step 1: create contact form and copy and paste below code.

and modified field according to your need.

<div id=”responsive-form” class=”clearfix”>

<div class=”form-row”>
<div class=”column-half”>First Name [text* first-name]</div>
<div class=”column-half”>Last Name [text* last-name]</div>
</div>

<div class=”form-row”>
<div class=”column-half”>Email [email* your-email]</div>
<div class=”column-half”>Phone [text* your-phone]</div>
</div>

<div class=”form-row”>
<div class=”column-full”>Subject [text* your-subject]</div>
</div>

<div class=”form-row”>
<div class=”column-full”>Your message [textarea your-message]</div>
</div>

<div class=”form-row”>
<div class=”column-full”>[submit “Send”]</div>
</div>

</div>

Step 2: copy below css and paste in your customiser

/* contact form7 style */
wpcf7 input[type=”text”], .wpcf7 input[type=”email”], .wpcf7 textarea {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 3px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
      box-sizing: border-box
}
.wpcf7 input[type=”text”]:focus{
background: #fff;
}
.wpcf7-submit{
float: right;
background: #CA0002;
color: #fff;
text-transform: uppercase;
border: none;
padding: 8px 20px;
cursor: pointer;
}
.wpcf7-submit:hover{
background: #ff0000;
}
span.wpcf7-not-valid-tip{
text-shadow: none;
font-size: 12px;
color: #fff;
background: #ff0000;
padding: 5px;
}
div.wpcf7-validation-errors { 
text-shadow: none;
border: transparent;
background: #f9cd00;
padding: 5px;
color: #9C6533;
text-align: center;
margin: 0;
font-size: 12px;
}
div.wpcf7-mail-sent-ok{
text-align: center;
text-shadow: none;
padding: 5px;
font-size: 12px;
background: #59a80f;
border-color: #59a80f;
color: #fff;
margin: 0;
}
#responsive-form{
max-width:600px /*– change this to get your desired form width –*/;
margin:0 auto;
        width:100%;
}
.form-row{
width: 100%;
}
.column-half, .column-full{
float: left;
position: relative;
padding: 0.65rem;
width:100%;
-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}
.clearfix:after {
content: “”;
display: table;
clear: both;
}
/**—————- Media query —————-**/
@media only screen and (min-width: 48em) { 
.column-half{
width: 50%;
}
}
/* end contact form7 style */
Secured By miniOrange