How to Submit the form without reloading the page with codeigniter - php

This is my form code which i was using with code ignitor
<div id="tab_register_content"class="content-form hidden">
<?php echo form_open('renty/sign_up_user')?>
<div>
<?php echo form_error('register_email');?>
<input id="register_email"class="input_placeholder email"type="text"value=""placeholder="Email address"name="register_email"/>
</div>
<div>
<?php echo form_error('password');?>
<input id="register_name" class="password" type="password" value="" name="password" onfocusout="get_form_value_from_user()"/>
</div>
<div>
<input id="register_remember_me_checkbox"type="checkbox"class="styled"name="remember_me"value="1"/>
<label for="register_remember_me_checkbox">
Remember me next time
</label>
</div>
<input class="admin-form-submit orange_button"type="submit"value="Continue"/>
<div class="admin_form_link">
<span class="sign_in">
<a class="tab_link_button"href="#sign_in"title="">
Already registered?
</a>
</span>for
</div>
</form>
</div>
I was using this form and i want to submit the from without reloading the page i was trying to the ajax code but its not working any suggestions? i commented the form_open line
<?php //echo form_open('renty/sign_up_user')?>
and then tried it with ajax but it's not working
<script type="text/javascript">
function get_form_value_from_user(){
var email = $(".email").val();
var password = $(".password").val();
if(email != "" && password != ""){
$.ajax({
url: '<?php echo base_url(); ?>/index.php/renty/sign_up_user?email='+email+'&password='+password,
success: 'Working'
});
}
}
</script>
My Controller
public function sign_up_user(){
$this->form_validation->set_rules('register_email','Register Email','required|valid_email|is_unique[sign_up.email]');
$this->form_validation->set_rules('password','Password','required|md5');
if($this->form_validation->run() == FALSE){
$this->load->view('application/index');
}
else
{
$data['email'] = $_GET['email'];
$data['password'] = $_GET['password'];
$this->load->model('renty/db_data');
$this->db_data->insert($data);
$this->home();
}
}

There is no need to add renty/sign_up_user to your form open action.
url attributes does the work in jquery.
If you remove <?php echo form_open('renty/sign_up_user')?>
and replace with <?php echo form_open('')?> it will solve it.

Related

How to integrate remember me after successful login using jquery ajax?

view: login.php
<script>
$(document).ready(function(){
$("#login").click(function(e){
e.preventDefault();
elogin = $("#elogin").val();
plogin = $("#plogin").val();
remember_me = $("#remember_me").val();
$.ajax({
type:"POST",
data:{"elogin":elogin,"plogin":plogin,"remember_me":remember_me},
url:"<?php echo base_url(); ?>redirect",
success: function(data) {
if (typeof data !== 'object') {
data = JSON.parse(data);
}
if (data.redirect)
{
window.location.replace(data.redirect);
}
else
{
$(".login_success").html('<p>' + data.error + '</p>');
}
}
});
});
});
</script>
<div class="tab-pane" id="profile" role="tabpanel" data-mh="log-tab">
<div class="title h6">Login to your Account</div>
<form class="content">
<div class="login_success"></div>
<div class="row">
<input class="form-control" placeholder="" type="email" id="elogin">
<input class="form-control" placeholder="" type="password" id="plogin">
<input name="optionsCheckboxes" id="remember_me" type="checkbox">Remember Me
</div>
Login
</div>
</div>
</form>
</div>
controller:
public function login_redirect()
{
$email = $this->input->post('elogin');
$password = $this->input->post('plogin');
$remember = $this->input->post('remember_me');
if($email=='' || $password=='')
{
echo json_encode(array('error' => 'All fields are mandatory. Please fill all details.'));
}
else
{
$this->db->select('*');
$this->db->from('user');
$where = "email='".$email."' and password='".$password."' and status='1'";
$this->db->where($where);
$query = $this->db->get();
if($query->num_rows() > 0)
{
$result = $query->result_array();
$this->session->set_userdata('user_id',$result);
if (!isset($_POST))
{
header ("Location:".base_url()."thankyou");
}
else
{
echo json_encode(array('redirect' => base_url().'thankyou'));
}
}
else
{
echo json_encode(array('error' => 'Wrong email or password or may be your account not activated.'));
}
}
}
In this code, I am creating a login module which works fine. Now, I also want to integrate the remember me option when user check remember me checkbox server ask to want to save detail or not. When user logout it doesn't require to fill it's detailed again inside the login form. Once the user checks on remember me checkbox. So, How can I do this? Please help me.
Thank You
You can make this by using cookie.
try following code:
//php (controller):
//after success login
if($remember){
//set cookie
$this->input->set_cookie('email', $email, 86500);
$this->input->set_cookie('password', $password, 86500);
}else
{
//delete cookie
delete_cookie('email');
delete_cookie('password');
}
view: login.php
//set cookie value if checked remember me.
<div class="row">
<input class="form-control" value="<?php if (get_cookie('email')) { echo get_cookie('email'); } ?>" placeholder="" type="email" id="elogin">
<input class="form-control" value="<?php if (get_cookie('password')) { echo get_cookie('password'); } ?>" placeholder="" type="password" id="plogin">
<input name="optionsCheckboxes" id="remember_me" type="checkbox" <?php if (get_cookie('email')) { ?> checked="checked" <?php } ?>>Remember Me
</div>
You can create the cookie with your javascript when you get the response of your ajax call. You should use document.cookie() if you choose this way to do.
If you choose the server side, CodeIgniter have a Cookie Helper. For use it, you have to add it 'cookie' on your autoload. You can load it with this line too :
$this->load->helper('cookie');
when the helper is loaded, you have to create the cookie in your controller like this :
$this->input->set_cookie('cookie_name', $value, time_in_seconds);

Different values returned for php session variable

I have been having this problem for the last two days now. I have two files on my local host.
http://localhost/project/sign-in.php and
http://localhost/project/form-handle/index.php
When a user lands on sign-in page a session variable is created
<?php
ob_start();
session_start();
$token = strtoupper(uniqid());
$_SESSION['token-string'] = $token;
I then put the session value in a hidden field
<input type='hidden' name='token-string' value='<?php echo $token; ?>'>
So far, so good. However, when I send the form values to http://localhost/project/form-handle/index.php
and return the value of the token string session, its different from what is in the hidden field. I am using jquery ajax to send the request.
Here is how I check for it in the form-handle page:
<?php
ob_start();
session_start();
if(isset($_SESSION['token-string'])){
$token = $_SESSION['token-string'];
echo $token;
}
?>
The value returned is totally different! Its important to know also that the wrong value returned is a string generated by the function
strtoupper(uniqid());
Am I doing something wrong here?
Here is the jQuery that submits the form
$('#service-login').click(function (evt) {
evt.preventDefault();
var form = $('#Ads-Login');
var data = form.serialize();
var url = 'form-handle/index.php';
var method = form.attr('method');
$.ajax({
type: method,
url: url,
data: data,
success: function (response) {
alert(response);
},
error: function () {
}
})
});
The html form is here
<form action="" method="post" id="Ads-Login">
<div class="form-group">
<input type="email" name="email" id="" class="form-control" placeholder="Email Address">
</div>
<div class="form-group">
<input type="hidden" name="token-string" value="<?php echo $token; ?>">
<input type="password" name="Password" id="" class="form-control" placeholder="Account Password">
<a class="btn btn-white dark-grey-text font-bold ml-0" href="" id="service-login"><i class="fa fa-play mr-1"></i> Login</a>
</div>
</form>

Unable to show error text in a div after ajax success

In my app I want to make a login page. I want do do this login using ajax jquery. If login success it navigate to next page or show a error message in a div.
this is my code
<form role="form">
<div class="form-group radio-inline">
<label><b>I Am</b></label>
<input type="radio" name="category" value="s"> Student
<input type="radio" name="category" value="t"> Teacher
<input type="radio" name="category" value="p"> Parent
</div>
<div class="form-group">
<input type="email" class="form-control" id="email" name="email" placeholder="Enter email address">
</div>
<div class="form-group">
<input type="password" class="form-control" id="password" name="password" placeholder="Enter password">
</div>
<button type="submit" class="btn btn-primary btn-block">Sign in</button>
</form>
<div id="error">
</div>
jquery
$(document).on('click','.btn',function() {
var email = $("#email").val();
var password = $("#password").val();
var category = $("input[name=category]:checked").val();
$.ajax({
url: "../logincheck.php",
type: "POST",
data: {category:category,email:email,password:password},
success:function(data) {
if (data==='studentlogin') {
window.location.href = '../student/index.php';
}
if(data==='teacherlogin'){
window.location.href = '../teacher/index.php';
}
if(data==='teachersubject') {
window.location.href = '../teacher/subjectadd.php';
}
else {
window.location.href = 'login.html';
$("#error").html("Invalis Email/Password");
}
}
});
});
logincheck.php
$category=$_POST['category'];
$email=$_POST['email'];
$pwd=$_POST['password'];
if ($category == 's') {
$result=mysqli_query($conn,"SELECT studentid,studentfname FROM studentinfo WHERE emailid='$email' and pwd='$pwd'");
$res=mysqli_fetch_array($result);
if($res[0]>0){
$_SESSION['snstudentid']=$res[0] ;
$_SESSION['snstudentfname']=$res[1] ;
echo "studentlogin";
//header("location:student/index.php");
exit();
}
else{
echo "error";
//header("location:pages/login.html");
}
} elseif ($category == 't') {
$result=mysqli_query($conn,"SELECT teacherid,teacherfname FROM teacherinfo WHERE emailid='$email' and pwd='$pwd'");
$res=mysqli_fetch_array($result);
if($res[0]>0){
$check_subject = mysqli_query($conn, "SELECT count(teachersubjectid) FROM teachersubject WHERE teacherid='$res[0]'");
$subject_result = mysqli_fetch_array($check_subject);
if ($subject_result[0]>0) {
$_SESSION['snteacherid']=$res[0];
$_SESSION['snteacherfname']=$res[1];
echo "teacherlogin";
//header("location:teacher/index.php");
exit();
} else {
$_SESSION['snteacherid']=$res[0];
$_SESSION['snteacherfname']=$res[1];
echo "teachersubject";
//header("location:teacher/subjectadd.php");
exit();
}
} else{
echo "error";
//header("location:pages/login.html");
}
}
that error message show for few second and then it goes.I do that error class style display:none;
How I do that?Please help me.
Have a look at what this code does:
else {
window.location.href = 'login.html';
$("#error").html("Invalis Email/Password");
}
yes, it redirects the page to login.html, then, while the page is loading it puts up the error message, then the page load completes and, in your initial login page, the error message is empty.
Remove the line:
window.location.href = 'login.html';
assuming you are already on login.html.
If <div id="error"> has a style of display:none;, then its contents will not be displayed. Inside of the ajax success callback, $("#error").html("Invalis Email/Password"); needs to be $("#error").html("Invalis Email/Password").show(); to set display:block;. See .show().

Won't run ajax if I change input type..?

I have a form for user to update their info using jquery + Ajax. Everything is working great so far, but WHen i change input type="email" to input type="text" in the fullname section of the form and click update. It got error??? It won't run the php file in ajax. I don't see any connection which causes this error? Anyone please sugguest why? But if I change input type in the fullname section back to "email". It works! This is so weird!
Here is my form:
<div id="changeuserinfo_result"></div>
<form role="form" method="post">
<div class="form-group">
<label>Fullname</label>
<input type="text" class="form-control" id="changename" name="changename" value="<?php echo $_SESSION['name'] ?>">
</div>
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" id="changepass" name="changepass" value="<?php echo $_SESSION['pass'] ?>">
</div>
<button class="btn btn-default" id="changeuserinfo">Update</button>
</form>
Here is my jquery code:
$(document).ready(function(){
$('#changename').focus();
$('#changeuserinfo').click(function(){
var changename = $('#changename');
var changepass = $('#changepass');
var changeuserinfo_result = $('#changeuserinfo_result');
changeuserinfo_result.html('loading...');
if(changename.val() == ''){
changename.focus();
changeuserinfo_result.html('<span class="errorss"> * Empty fullname</span>');
return false;
}
else if(changepass.val() == ''){
changepass.focus();
changeuserinfo_result.html('<span class="errorss">* Empty password</span>');
return false;
}
else {
var UrlToPass = {changename:changename.val(),changepass:changepass.val()} ;
$.ajax({
type : 'POST',
cache: false,
data : UrlToPass,
url : 'changeuserinfo.php',
success: function(responseText){
if(responseText == 1){
$('#changeuserinfo_result').html('<span style="color:green"> Update OK</span>');
}
else{
$('#changeuserinfo_result').html('<span class="errorss"> Update fail. Try again</span>');
}
}
});
}
});
});
You have no closing tags on your inputs.
It should be <input type="text"... />
Also set the doctype of the page to HTML5.
<!DOCTYPE HTML>
....
</html>

How to get the values from a submitted do...while form

I have the following code with a form inside a list that should submit the element through Ajax. The values in the form is repeated through a do ... while loop, so that the list become a dynamically list, like in this picture:
But when I click a button, the only element that is sent through the Ajax code is the value of the last button, even though I click on Oranges for example.
The code is as follow:
<script>
function submitForm() {
$.ajax({type:'POST', url: 'jQuery-ajax-demo.php', data:$('#MyJobsForm').serialize(), success: function(response) {
$('#myJobs_Right').find('.form_result').html(response);
}});
return false;
}
</script>
</head>
<body>
<ul id="btn_MyJobs" data-role="listview" data-inset="true">
<li id="MyJobs_List" class="push">
<form id="MyJobsForm" onsubmit="return submitForm();">
<?php do { ?>
<input type="hidden" name="name" value="<?php echo $row_Recordset1['cargo']; ?>">
<input type="submit" name="submit" value="<?php echo $row_Recordset1['cargo']; ?>">
<br/>
<br/>
<?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
</form>
</li>
</ul>
<div id="myJobs_Right">
<div class="form_result"> </div>
</div>
</body>
The jQuery-ajax-demo.php page looks like this:
<?php
if(isset($_POST['name'])) {
$name = $_POST['name'];
?>
Your Name Is: <?php echo $name; ?><br />
<?php
die();
}
?>
If you have to do it this way, then you might try creating a new form for each button:
<?php do { ?>
<form onsubmit="return submitForm(this);"> <!--Note I added "this" -->
<input type="hidden" name="name" value="<?php echo $row_Recordset1['cargo']; ?>">
<input type="submit" name="submit" value="<?php echo $row_Recordset1['cargo']; ?>">
<br/>
<br/>
</form>
<?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
Then the only value that will get posted will be the hidden value that is in the form whose button you clicked. I updated the onsubmit call above to include this in the call. So you can do the below in your function:
function submitForm(form) {
var $form = $(form);
$.ajax({
type:'POST',
url: 'jQuery-ajax-demo.php',
data:$form.serialize(),
success: function(response) {
$('#myJobs_Right').find('.form_result').html(response);
}
});
return false;
}

Categories