Submit form and save data in database with codeigniter mysql

Submit form and save data in database with codeigniter mysql

Hello World, Welcome to the codeigniter tutorial series “Learn Codeigniter from Scratch”. In this tutorial we learn that how we can submit form and save data in database with codeigniter mysql. I have extended the previous tutorial so please update with previous tutorials.

In the last tutorial we have learned that how we can connect  and fetch data from database with codeigniter. We have inserted the data manually in the last tutorial but in this tutorial we will insert data in database with form. We are working on Todo list. In this tutorial we will add Todo list via form with codeigniter.

I have divided this tutorial in following  parts:

  • Create Todo list add form
  • Submit form and save data
  • Test the application

Create Todo list add form

In this step we will create view of add form and also create relative controller to handle the form. lets start the work:

  • Create add.php file in application/views/todo folder and add the following code.
<!DOCTYPE html>
<html>
<head>
	<title><?php echo $page_title; ?></title>
	<link rel="stylesheet" type="text/css" href="<?php echo base_url('public/bootstrap.min.css') ?>" />
</head>
<body>
	<div class="container">
		<h1 class="page-header">Add Todo List 
			<a href="<?php echo site_url('todo'); ?>" class="btn btn-sm btn-danger pull-right">Task List</a>
		</h1>
		<form action="" method="post">
			<table class="table table-striped table-bordered">
				<tr>
					<th>Add Task</th>
					<td><input type="text" class="form-control" name="task_title" /></td>
				</tr>
				<tr>
					<td colspan="2">
						<input type="submit" class="btn btn-danger" value="Add Task" />
					</td>
				</tr>
			</table>
		</form>
	</div>
</body>
</html>
  • Change the url of Add button in todo.php file in application/views/todo folder.
<a href="<?php echo site_url('todo/add'); ?>" class="btn btn-sm btn-danger pull-right">Add Task</a>

The above link will redirect us to Add Form.

  • Now add the add method  in Todo.php controller in application/controllers after index method.
// Add todo list
	function add(){
		$data['page_title']="Add To-Do List";
		$this->load->view('todo/add.php',$data);
	}

We have created the view for our add form. Now when you will open path-to-todo/index.php/todo/add, you will see the following screenshot.

add-form

 


Submit the form and save the data

In this step we will submit the form and save the data in database. We will also create model for handle the form data.

  • First we will submit the form. Codeigniter provide us form_validation library so that we can validate the form. Include this library in Todo controller.
// Load Library
$this->load->library('form_validation');
  • Replace the add method with following code.
// Add todo list
	function add(){
		$data['page_title']="Add To-Do List";
		// Submit Form
		$this->form_validation->set_rules('task_title','Task Title','trim|required');
		if($this->form_validation->run()===true){
			// Process the form data
		}
		$this->load->view('todo/add.php',$data);
	}
  • Add the following code before the form like following:
<p><?php echo validation_errors(); ?></p>
		<form action="" method="post">
.......

Above code will show the validation message. You can try without filling the form and submit the button.

Now its time to create model for handling the form data and save in database.

  • Add the add method in Todo Model that you have created in the previous tutorial.
function add(){
		$insertData=array(
			'task_title'=>$this->input->post('task_title'),
			'task_status'=>'pending'
		);
		$insertQuery=$this->db->insert('todo_list',$insertData);
		if($this->db->affected_rows()>0){
			return 'Data has been added';
		}else{
			return 'Data has not been added';
		}
	}

Change the following things in following files:

  • Replace  // Process the form data comment with code in Todo controller add method.
// Submit Form
		$this->form_validation->set_rules('task_title','Task Title','trim|required');
		if($this->form_validation->run()===true){
			// Process the data
			$dbRes=$this->Todo_model->add();
			$data['msg']=$dbRes;
		}
  • Add the following line before the validation_errors() function in add view file.
<p>
			<?php
			if(isset($msg)){
				echo $msg;
			}
			?>
		</p>

Now its time to check the form. Open the form in browser and try to add some data. If you will see the success message, it means data has been added successfully in database. To verify the data you can check the database.

Congratulation, You have successfully created the form and save the data in database with codeigniter. 🙂

In the next tutorial, we will make our Todo List application fully dynamic. We will also implement the pagination with codeigniter on this application.

Leave a Reply

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