Codeigniter multiple form in one page with separate validation - php

Question

I have two form in one page. When I click on the submit button of form one, the validation error shows on both forms. How could show separate validation errors on each form?
This is my view:
<?php echo form_open('user_signup/login',['class'=>'login-form','id'=>'submit_form']);
echo validation_errors();?>
<h3 class="form-title font-green">Sign In</h3>
<div class="alert alert-danger display-hide">
<button class="close" data-close="alert"></button>
<span> Enter any username and password. </span>
</div>
<div class="form-group">
<!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
<label class="control-label visible-ie8 visible-ie9">Email</label>
<?php echo form_input(['name'=>'email1','type'=>'text','style'=>'text-transform: capitalize;','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Email','value'=>set_value('email1')]); ?>
</div>
<div class="form-group">
<label class="control-label visible-ie8 visible-ie9">Password</label>
<?php echo form_input(['name'=>'pass','type'=>'password','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Password']); ?>
</div>
<div class="form-actions">
<?php echo form_submit('submit', 'Submit',"class='btn green uppercase'" ); ?>
Forgot Password?
</div>
<div class="login-options">
<h4>Or login with</h4>
<ul class="social-icons">
<li>
<a class="social-icon-color facebook" data-original-title="facebook" href="javascript:;"></a>
</li>
<li>
<a class="social-icon-color twitter" data-original-title="Twitter" href="javascript:;"></a>
</li>
<li>
<a class="social-icon-color googleplus" data-original-title="Goole Plus" href="javascript:;"></a>
</li>
<li>
<a class="social-icon-color linkedin" data-original-title="Linkedin" href="javascript:;"></a>
</li>
</ul>
</div>
<div class="create-account">
<p>
Create an account
</p>
</div>
</form>
<!-- END LOGIN FORM -->
<!-- BEGIN FORGOT PASSWORD FORM -->
<form class="forget-form" action="http://keenthemes.com/preview/metronic/theme/admin_2/index.html" method="post">
<h3 class="font-green">Forget Password ?</h3>
<p> Enter your e-mail address below to reset your password. </p>
<div class="form-group">
<input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="Email" name="email" /> </div>
<div class="form-actions">
<button type="button" id="back-btn" class="btn green btn-outline">Back</button>
<button type="submit" class="btn btn-success uppercase pull-right">Submit</button>
</div>
</form>
<!-- END FORGOT PASSWORD FORM -->
<!-- BEGIN REGISTRATION FORM -->
<?php echo form_open('user_signup/login',['class'=>'register-form','id'=>'register_form']);
?>
<h3 class="font-green">Sign Up</h3>
<p class="hint"> Enter your personal details below: </p>
<div class="form-group">
<label class="control-label visible-ie8 visible-ie9">Roll NO</label>
<?php echo form_input(['name'=>'rollno','type'=>'text','style'=>'text-transform: capitalize;','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Rollno','value'=>set_value('rollno')]); ?>
</div>
<div class="form-group">
<!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
<label class="control-label visible-ie8 visible-ie9">Email</label>
<?php echo form_input(['name'=>'email2','type'=>'text','style'=>'text-transform: capitalize;','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Email','value'=>set_value('email2')]); ?>
</div>
<div class="form-actions">
<button type="button" id="register-back-btn" class="btn green btn-outline">Back</button>
<?php echo form_submit('register', 'register',"class='btn btn-success uppercase pull-right'" ); ?>
This is my controller:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class User_signup extends CI_Controller {
public function index()
{
$this->load->view('User/signup');
}
public function login()
{
if ($this->input->post('submit_form')) {
$rules['email1'] = 'required';
$rules['pass'] = 'required';
$this->form_validation->set_rules($rules);
}
else if ($this->input->post('register_form')) {
$rules['rollno'] = 'required';
$rules['email2'] = 'required';
$this->validation->set_rules($rules);
}
if (!$this->form_validation->run()) {
$this->load->view('User/signup');
}
else {
if ($this->input->post('submit_form'))
echo 'Form 1 posted !';
else if ($this->input->post('register_form'))
echo 'Form 2 posted !';
}
}
}

Answer 1

There are two things you need to concern about that. First passing action in HTML form. Second is, getting those parameters and code accordingly in your controller's action.
<?php echo form_open('user_signup/login/form-1',['class'=>'login-form','id'=>'submit_form']);
echo validation_errors();?>
<h3 class="form-title font-green">Sign In</h3>
<div class="alert alert-danger display-hide">
<button class="close" data-close="alert"></button>
<span> Enter any username and password. </span>
</div>
<div class="form-group">
<!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
<label class="control-label visible-ie8 visible-ie9">Email</label>
<?php echo form_input(['name'=>'email1','type'=>'text','style'=>'text-transform: capitalize;','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Email','value'=>set_value('email1')]); ?>
</div>
<div class="form-group">
<label class="control-label visible-ie8 visible-ie9">Password</label>
<?php echo form_input(['name'=>'pass','type'=>'password','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Password']); ?>
</div>
<div class="form-actions">
<?php echo form_submit('submit', 'Submit',"class='btn green uppercase'" ); ?>
Forgot Password?
</div>
<div class="login-options">
<h4>Or login with</h4>
<ul class="social-icons">
<li>
<a class="social-icon-color facebook" data-original-title="facebook" href="javascript:;"></a>
</li>
<li>
<a class="social-icon-color twitter" data-original-title="Twitter" href="javascript:;"></a>
</li>
<li>
<a class="social-icon-color googleplus" data-original-title="Goole Plus" href="javascript:;"></a>
</li>
<li>
<a class="social-icon-color linkedin" data-original-title="Linkedin" href="javascript:;"></a>
</li>
</ul>
</div>
<div class="create-account">
<p>
Create an account
</p>
</div>
</form>
<!-- END LOGIN FORM -->
<!-- BEGIN FORGOT PASSWORD FORM -->
<form class="forget-form" action="http://keenthemes.com/preview/metronic/theme/admin_2/index.html" method="post">
<h3 class="font-green">Forget Password ?</h3>
<p> Enter your e-mail address below to reset your password. </p>
<div class="form-group">
<input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="Email" name="email" /> </div>
<div class="form-actions">
<button type="button" id="back-btn" class="btn green btn-outline">Back</button>
<button type="submit" class="btn btn-success uppercase pull-right">Submit</button>
</div>
</form>
<!-- END FORGOT PASSWORD FORM -->
<!-- BEGIN REGISTRATION FORM -->
<?php echo form_open('user_signup/login/form-2',['class'=>'register-form','id'=>'register_form']);
?>
<h3 class="font-green">Sign Up</h3>
<p class="hint"> Enter your personal details below: </p>
<div class="form-group">
<label class="control-label visible-ie8 visible-ie9">Roll NO</label>
<?php echo form_input(['name'=>'rollno','type'=>'text','style'=>'text-transform: capitalize;','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Rollno','value'=>set_value('rollno')]); ?>
</div>
<div class="form-group">
<!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
<label class="control-label visible-ie8 visible-ie9">Email</label>
<?php echo form_input(['name'=>'email2','type'=>'text','style'=>'text-transform: capitalize;','class'=>'form-control form-control-solid placeholder-no-fix','autocomplete'=>'off','placeholder'=>'Email','value'=>set_value('email2')]); ?>
</div>
<div class="form-actions">
<button type="button" id="register-back-btn" class="btn green btn-outline">Back</button>
<?php echo form_submit('register', 'register',"class='btn btn-success uppercase pull-right'" ); ?>
Note: Check form actions
Here is your updated controller:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class User_signup extends CI_Controller {
public function index()
{
$this->load->view('User/signup');
}
public function login()
{
// Checking passed 3rd parameter in URI string.
$submitted_form = $this->uri->segment(3)?$this->uri->segment(3):false;
if ($submitted_form == 'form-1') {
$rules['email1'] = 'required';
$rules['pass'] = 'required';
$this->form_validation->set_rules($rules);
}
if ($submitted_form == 'form-2') {
$rules['rollno'] = 'required';
$rules['email2'] = 'required';
$this->validation->set_rules($rules);
}
if ($this->form_validation->run()) {
if ($submitted_form == 'form-1')
echo 'Form 1 posted !';
else if ($submitted_form == 'form-1')
echo 'Form 2 posted !';
}
$this->load->view('User/signup');
}
}
Let me know if you have any confusion.

Answer 2

Submit by Jquery. For Example in your view
<form id="form1" action="" method="post">
<label>Username</label>
<input type="text" name="username">
<label>Password</label>
<input type="password" name="password">
<input type="hidden" name="form_type" value="login">
<button type="submit" onClick="login()">Login</button>
</form>
<form id="form2" action="" method="post">
<label>Username</label>
<input type="text" name="username">
<label>Password</label>
<input type="password" name="password">
<label>Email</label>
<input type="email" name="email">
<input type="hidden" name="form_type" value="register">
<button type="submit" onClick="register()">Login</button>
</form>
Jquery Script
<script>
function login()
{
$('#form1').submit();
}
function register()
{
$('#form2').submit();
}
</script>
Now in your controller
if($_POST)
{
if($_POST['form_type']=='login')
{
// Validate Login
}
elseif($_POST['form_type']=='register')
{
// validate register
}
}