Posted inJavaScript / Ajax / jQuery

jquery ajax image upload preview codeigniter

Today, We want to share with you jquery ajax image upload preview codeigniter.In this post we will show you upload multiple image files in codeigniter using ajax jquery, hear for upload video using ajax jquery in php we will give you demo and example for implement.In this post, we will learn about How To Upload Multiple Files And Images In CodeIgniter? with an example.

CodeIgniter Upload Image File With Preview Using Jquery Ajax

Step 1: Download and install Codeigniter

Example 1:
below Link for Download CodeIgniter.

Click Here : Download CodeIgniter.

Step 2: Create a Database in table

CREATE TABLE onlinemovie(
id INT(11) PRIMARY KEY AUTO_INCREMENT,
title VARCHAR(164),
image VARCHAR(164)
)ENGINE=INNODB;

Step 3: Connect to Database

$db['default'] = array(
	'dsn'	=> '',
	'hostname' => 'localhost',
	'username' => 'root',
	'password' => 'DFDSf78@#$%^44f',
	'database' => 'pakainfo_website',
	'dbdriver' => 'mysqli',
	'dbprefix' => '',
	'pconnect' => FALSE,
	'db_debug' => (ENVIRONMENT !== 'production'),
	'cache_on' => FALSE,
	'cachedir' => '',
	'char_set' => 'utf8',
	'dbcollat' => 'utf8_general_ci',
	'swap_pre' => '',
	'encrypt' => FALSE,
	'compress' => FALSE,
	'stricton' => FALSE,
	'failover' => array(),
	'save_queries' => TRUE
);	

Step 4: Create Controller

application/controller/Upload_image.php

load->model('upload_model');
    }

    function movie_upload()  
	{  
	   $this->load->view('movie_upload');  
	}  
	
    function ajax_upload()  
    {  
	   if(isset($_FILES["file"]["name"]))  
	   {  
			$config['upload_path'] = './assets/images';  
			$config['allowed_types'] = 'jpg|jpeg|png|gif';  
			$this->load->library('upload', $config);  
			if(!$this->upload->do_upload('file'))  
			{  
				 echo $this->upload->display_errors();  
			}  
			else  
			{  
				$data = array('upload_data' => $this->upload->data());
 
				$title= $this->input->post('title');
				$image= $data['upload_data']['file_name']; 
				 
				$result= $this->upload_model->save_upload($title,$image);
  
				echo 'jquery ajax image upload preview codeigniter';  
			}  
	   }  
    }  
}

?>

Step 5: Create a Model

application/models/Upload_model.php

 $title,
                'image' => $image
            );  
        $result= $this->db->insert('onlinemovie',$data);
        return $result;
    }     
}
?>

Step 6: Create The View

movie_upload.php




    
    CodeIgniter Upload Image File with preview using Jquery Ajax - www.pakainfo.com
    


    

Upload files using Codeigniter and Ajax

I hope you get an idea about jquery ajax image upload with preview.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

I am Jaydeep Gondaliya , a software engineer, the founder and the person running Pakainfo. I'm a full-stack developer, entrepreneur and owner of Pakainfo.com. I live in India and I love to write tutorials and tips that can help to other artisan, a Passionate Blogger, who love to share the informative content on PHP, JavaScript, jQuery, Laravel, CodeIgniter, VueJS, AngularJS and Bootstrap from the early stage.

Leave a Reply

Your email address will not be published. Required fields are marked *

We accept paid guest Posting on our Site : Guest Post Chat with Us On Skype