Javascript next or previous button - javascript

This is My Model When i click my model
<div class="modal fade" id="checkoutModal" tabindex="-1" role="dialog" aria-labelledby="checkoutModalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="checkoutModalLabel">Shipping Address</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<div class="row">
<form action="thankYou.php" method="post" id="payment-form">
This tag tall every problem and there is background color call passed
<p class="bg-danger" id="payment-errors"></p>
This is the problem
There was Step 1 div open wher i click next then not going next div in step 2 as like pill type
<div id="step1" style="display: block;">
<div class="from-group col-md-6">
<label for="full_name">Full Name:</label>
<input class="form-control" id="full_name" name="full_name" type="text">
</div>
<div class="from-group col-md-6">
<label for="email">Email :</label>
<input class="form-control" id="email" name="email" type="email">
</div>
<div class="from-group col-md-6">
<label for="street">Street Address:</label>
<input class="form-control" id="street" name="street" type="text">
</div>
<div class="from-group col-md-6">
<label for="street2">Street Address 2:</label>
<input class="form-control" id="street2" name="street2" type="text">
</div>
<div class="from-group col-md-6">
<label for="city">City :</label>
<input class="form-control" id="city" name="city" type="text">
</div>
<div class="from-group col-md-6">
<label for="state">State :</label>
<input class="form-control" id="state" name="state" type="text">
</div>
<div class="from-group col-md-6">
<label for="zip_code">Zip Code:</label>
<input class="form-control" id="zip_code" name="zip_code" type="text">
</div>
<div class="from-group col-md-6">
<label for="country">Country:</label>
<input class="form-control" id="country" name="country" type="text">
</div>
</div>
When click next this div not open some error and this error up
<div id="step2" style="display: none;"></div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" onclick="check_address();">Next >></button>
</div>
</div>
</div>
</div>
<?php endif; ?>
</div>
</div>
This is the button function work i think may help you
<script>
function check_address(){
var data = {
'full_name' : jQuery('#full_name').val(),
'email' : jQuery('#email').val(),
'street' : jQuery('#street').val(),
'street2' : jQuery('#street2').val(),
'city' : jQuery('#city').val(),
'state' : jQuery('#state').val(),
'zip_code' : jQuery('#zip_code').val(),
'country' : jQuery('#country').val()
};
jQuery.ajax({
url : '/ecommerce/admin/parsers/check_address.php',
method : 'POST',
data : data,
success : function(data){
if(data != 'passed'){
jQuery('#payment-errors').html(data);
}
if(data == 'passed'){
alert('Passed!');
}
},
error : function (){alert("Something Went Wrong");}
});
}
</script>
This is another page link and this is check file for java script file
<?php
require_once $_SERVER['DOCUMENT_ROOT'].'/ecommerce/connection/init.php';
$name = sanitize($_POST['full_name']);
$email = sanitize($_POST['email']);
$street = sanitize($_POST['street']);
$street2 = sanitize($_POST['street2']);
$city = sanitize($_POST['city']);
$state = sanitize($_POST['state']);
$zip_code = sanitize($_POST['zip_code']);
$country = sanitize($_POST['country']);
$errors = array();
$required = array (
'full_name' => 'Full Name',
'email' => 'Email',
'street' => 'Street Address',
'city' => 'City',
'state' => 'State',
'zip_code' => 'Zip Code',
'country' => 'Country',
);
//All field is Required
foreach($required as $f => $d){
if(empty($_POST[$f]) || $_POST[$f] == ''){
$errors[] = $d.' is required.';
}
}
// Valid Email Address
if(!filter_var($email,FILTER_VALIDATE_EMAIL)){
$errors[] = 'Please Enter a valid Email.';
}
if(!empty($errors)){
echo display_errors($errors);
}else{
echo 'passed';
}

Related

Modal validation using Bootstrap Modal - PHP

PHP Script & Validation:
function SampleInput($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
if (isset($_POST['RegisterClient'])) {
$file = $_FILES['avatar']['name'];
$file_location = $_FILES['avatar']['tmp_name'];
$folder = "../Public/img/uploads/profile-picture/";
$new_file_name = strtolower($file);
$final_file = str_replace(' ', '-', $new_file_name);
$name = htmlspecialchars(trim($_POST['name'], ENT_QUOTES));
$username = htmlspecialchars(trim($_POST['username'], ENT_QUOTES));
$email = htmlspecialchars(trim($_POST['email'], ENT_QUOTES));
$password = htmlspecialchars(trim($_POST['password'], ENT_QUOTES));
$cpassword = htmlspecialchars(trim($_POST['cpassword'], ENT_QUOTES));
$role = htmlspecialchars(trim($_POST['role'], ENT_QUOTES));
if (move_uploaded_file($file_location, $folder.$final_file)) {
$image = $final_file;
}
if(empty($_POST['name']) || empty($_POST['username']) || empty($_POST['password']) || empty($_POST['cpassword']) || empty($_POST['role'])) {
$error = "All fields are required!";
} else {
$name = SampleInput($_POST['name']);
$username = SampleInput($_POST['username']);
$password = SampleInput($_POST['password']);
$cpassword =SampleInput($_POST['cpassword']);
$role = SampleInput($_POST['role']);
if (!preg_match('/^[a-zA-Z0-9\s]+$/',$name && $username && $password && $cpassword && $role)) {
$error = "Only letters and white space allowed";
}
}
$stmt = $db->prepare("INSERT INTO clients(name, username, email, password, avatar, role, registration_date) VALUES (:name, :username, :email, :password, :avatar, :role, NOW())");
$stmt->execute(array(
'name' => $name,
'username' => $username,
'email' => $email,
'password' => $password,
'avatar' => $image,
'role' => $role
));
$success = 'Registered!';
}
Modal:
<div class="modal fade" id="add" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<form action="" method="POST" enctype="multipart/form-data">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Create user</h5>
<button class="close" type="button" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<?php
if ($error) {
echo '<div class="mb-3">' . $error . '</div>';
} else if ($success) {
echo '<div class="mb-3">' . $success . '</div>';
}
?>
<div class="row gx-3 mb-3">
<div class="col-md-12">
<label class="small mb-1" for="login-fullname">Full name*</label>
<input class="form-control" name="name" type="text" placeholder="Valid full name" />
</div>
</div>
<div class="mb-3">
<label class="small mb-1" for="login-username">Username (how your name will appear to other users on the site)</label>
<input class="form-control" name="username" type="text" placeholder="Valid username" />
</div>
<div class="mb-3">
<label class="small mb-1" for="login-email">Email address</label>
<input class="form-control" name="email" type="text" placeholder="Valid email" />
</div>
<div class="row gx-3 mb-3">
<div class="col-md-6">
<label class="small mb-1" for="login-password">Password</label>
<input class="form-control" name="password" type="password" placeholder="Strong password" />
</div>
<div class="col-md-6">
<label class="small mb-1" for="login-cpassword">Confirm Password</label>
<input class="form-control" name="cpassword" type="password" placeholder="Strong password" />
</div>
</div>
<div class="row gx-3 mb-3">
<div class="card-body text-center">
<input type="file" required class="btn btn-primary" name="avatar">
<div class="small font-italic text-muted mb-6">JPG or PNG no larger than 5 MB</div>
</div>
</div>
<div class="mb-3">
<label class="small mb-1" for="selectRole">Select user role</label>
<select class="form-control" name="role">
<option value="">Select user role</option>
<option value="admin">Admin</option>
<option value="user">User</option>
</select>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">Close</button>
<button type="submit" name="RegisterClient" class="btn btn-primary">Create</button>
</div>
</div>
</form>
</div>
</div>
I don't know where the problem is, I want the modal to remain open even if the problem or form has been submitted successfully. Now, with this code, if there is a problem with the submit form, the modal shuts down and if we open it again, the user can see error messages. Where am I wrong?

After a whole day, I resolve an issue with this.
$('#myModal').modal({
backdrop: 'static',
keyboard: false
})
With this code written above, a modal will be closed only if the user clicks on the close button. With this code, you disabled the close modal by pressing the ESC button on the keyboard.

Cant get data from form sent to mysql database

Can someone help, I cant seem to get the data colleted from the form to be sent to the mysql database.
I am very new to coding and I cant seem to figure out why the form data is not being sent to the mysql database table.
Please any help would be muchly appricated.
once I press submit the page closes than refreshs without any errors, but the data has not been sent to the database table.
Please see code below.
<?php include'inc/header.php'; ?>
<div class="container">
<center>
<h2 style="color: #odc16f">Shipped</h2>
<hr>
</center>
<center>
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#addEmpModal">
Add Order
</button>
</center>
<!-- Modal -->
<div class="modal fade" id="addEmpModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<form action="" method="post">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria- hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Add New Order</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label>Enter Name</label>
<input class="form-control" type="text" name="customer" id="customer" placeholder="Enter Name">
<label id="lbcustomer" style="color:red"></label>
</div>
<div class="form-group">
<label>Enter Date</label>
<input class="form-control" type="date" name="date" id="date" placeholder="Enter Date">
<label id="lbdate" style="color:red"></label>
</div>
<div class="form-group">
<label>Enter Invoice</label>
<input class="form-control" type="number" name="invoice" id="invoice" placeholder="Enter Invoice">
<label id="lbinvoice" style="color:red"></label>
</div>
<div class="form-group">
<label>Enter eBay</label>
<input class="form-control" type="number" name="ebay" id="ebay" placeholder="Enter eBay">
<label id="lbebay" style="color:red"></label>
</div>
<div class="form-group">
<label>Enter Shipped</label>
<input class="form-control" type="text" name="shipper" id="shipper" placeholder="Enter Shipped">
<label id="lbshipper" style="color:red"></label>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" id="save">Save changes</button>
</div>
</form>
</div>
</div>
</div>
</div><!-- /.container ends here -->
<?php
include'inc/footer.php';
?>
<script>
$(document).ready(function() {
$(document).on('click', '#save', function() {
var customer = $("#customer").val();
var date = $("#date").val();
var invoice = $("#invoice").val();
var ebay = $("#ebay").val();
var shipper = $("#shipper").val();
if (customer == "") {
$("#lbcustomer").html("Enter Name");
} else if (date == "") {
$("#lbdate").html("Enter Date");
} else if (invoice == "") {
$("#lbinvoice").html("Enter Invoice");
} else if (ebay == "") {
$("#lbebay").html("Enter eBay");
} else if (shipper == "") {
$("#lbshipper").html("Enter Shipper");
} else {
$.ajax({
url: "save_data.php",
type: "post",
data: {
customer: customer,
date: date,
invoice: invoice,
ebay: ebay,
shipper: shipper
},
success: function(data) {
alert("Order Has Been Successful");
$("#addEmpModal").modal('hide');
location.reload();
}
});
}
});
});
</script>
Please see below the save_data.php code
<$php
include 'config/config.php';
global $con;
$customer = $_POST['customer'];
$date = $_POST['date'];
$invoice = $_POST['invoice'];
$ebay = $_POST['ebay'];
$shipper = $_POST['shipper'];
$save_data = "INSERT INTO orders(customer, date, invoice, ebay, shipper)VALUES('$customer','$date','$invoice','$ebay','$shipper')";
$result = mysqli_query($con, $save_data);
and below is the config.php code.
<?php
$con = mysqli_connect("localhost","root","Password","shippedorders");
if (!$con) {
echo "Failed to connect to MySQL: ".mysqli_connect_error($con);
}

you are missing
action in :
<form action="save_data.php" method="post">
or are you running your php in same page as html ? or you

Multiple contact forms on one page

I'm currently creating a dummy site and want to create multiple forms on one page.
So when you click each service you can send a form to request a quote. I got the first form working fine, however, when I send the second form it just sends the data from the first?
For the second form, I just replaced the ID to contactform2 instead of contactform as shown below.
<div id="registerpremium" class="modal fade">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header col-md-12">
<img class=" logo_h modallogo" src="img/logo.svg">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body signupmessage">
<img src="img/marketing.svg" alt="" class="img-fluid modalicon">
<h3 class="col-md-12 formtext py-4">eCommerce Premium</h3>
<p class="text-center">Please fill in the form below, we will then send you an email to confirm where to send your products.</p>
<form id="contactform" method="post" name="contactform" onsubmit="return false;">
<div class="form-group pt-3">
<label class="sr-only pt-5" for="name">Name</label>
<input type="text" class="form-control form-control-danger form-control-lg" name="name" id="Name" placeholder="Name*">
</div>
<div class="form-group">
<label class="sr-only" for="mail">Email</label>
<input type="email" class="form-control form-control form-control-lg" name="email" id="mail" placeholder="Email*">
</div>
<div class="form-group">
<label class="sr-only" for="mail">Phone Number</label>
<input type="phone" class="form-control form-control form-control-lg" name="phone" id="phone" placeholder="Phone Number">
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="checkbox" id="gdpr" name="gdpr" class="form-control md-textarea"></textarea>
<label for="gdpr" name="gdprlabel">I have read and consent to my data being collected as outlined in the Disclaimer</label>
</div>
</div>
</div>
<div class="modal-footer py-4">
<button type="submit" class="button button-header bg">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>
For the second form, I just replaced the ID to contactform2
$('#contactform2').validate({
rules: {
name: {
required: true
},
email: {
required: true,
email: true
},
gdpr: {
required: true
}
},
errorPlacement: function(){
return false;
},
submitHandler: function(){
var contactform = $('#contactform2').serialize();
$.ajax({
type: "POST",
url: 'ajax.php',
data: {
contactform: contactform
},
success: function(data){
$('#contactform2').hide();
$('.signupmessage').html('<p id="successmessage">' + data + '</p>');
},
error: function(xhr,textStatus,err){
console.log("readyState: " + xhr.readyState);
console.log("responseText: "+ xhr.responseText);
console.log("status: " + xhr.status);
console.log("text status: " + textStatus);
console.log("error: " + err);
}
});
}
});
PHP for the second form if you remove the 2 after contact form that is what I am using for the first form. The reason I know the first form sends is because I have test instead of test2 in the subject, title etc.
<?php
if (isset($_POST['contactform2'])) {
parse_str($_POST['contactform2'], $contactformData);
$name = $contactform2Data['name'];
$email = $contactform2Data['email'];
$phone = $contactform2Data['phone'];
$to = 'hello#samuelrhys.com'; //change to desired recepient
$subject = "test2";
$message = "test2". "\n" .$name. "\n" .$email. "\n" .$phone. "\n" .$message;
$headers = "test2" . "\r\n"; //change domain to that of Poppyfields
$result = mail($to, $subject, $message, $headers);
if ($result) {
echo "Thanks for contacting us, we'll be in touch soon!";
} else {
echo "Uh oh. We couldn't deliver your request at this time.";
}
}
?>
My Second form html
<div id="registerstandard" class="modal fade">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header col-md-12">
<img class=" logo_h modallogo" src="img/logo.svg">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body signupmessage">
<img src="img/marketing.svg" alt="" class="img-fluid modalicon">
<h3 class="col-md-12 formtext py-4">eCommerce Standard</h3>
<p class="text-center">Please fill in the form below, we will then send you an email to confirm where to send your products.</p>
<form id="contactform2" method="post" name="contactform2" onsubmit="return false;">
<div class="form-group pt-3">
<label class="sr-only pt-5" for="name">Name</label>
<input type="text" class="form-control form-control-danger form-control-lg" name="name" id="Name" placeholder="Name*">
</div>
<div class="form-group">
<label class="sr-only" for="mail">Email</label>
<input type="email" class="form-control form-control form-control-lg" name="email" id="mail" placeholder="Email*">
</div>
<div class="form-group">
<label class="sr-only" for="mail">Phone Number</label>
<input type="phone" class="form-control form-control form-control-lg" name="phone" id="phone" placeholder="Phone Number">
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="checkbox" id="gdpr" name="gdpr" class="form-control md-textarea"></textarea>
<label for="gdpr" name="gdprlabel">I have read and consent to my data being collected as outlined in the Disclaimer</label>
</div>
</div>
</div>
<div class="modal-footer py-4">
<button type="submit" class="button button-header bg">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>

You need to change name tag value in HTML for access post request from PHP !!

Show Signup modal window then Login modal right away

I have a nav bar with options for signup or login. Once clicked on either it will display a modal window using Bootstrap. What I am trying to do is that when the user is finished with the join modal window (pressed submit button and submitted data to the controller), I want to show the signin modal window right after. Show my idea was when submitting the form data to the controller. The controller would respond back with a display-type equaling "join, signin, nothing" and reinclude the page. In the page it will check what the display-type is then will call either show_join_modal() function if the display-type is signup or call either show_signin_modal() function if the display-type is login.
My idea using JQuery was something like this, Here is code in the startpage.php
<script>
<?php
if (isset($display_type))
if ($display_type == 'signin')
echo 'show_signin_modal();';
else if ($display_type == 'join')
echo 'show_join_modal();';
else
;
?>
function show_signin_modal() {
$("#signinModal").modal("show");
}
function show_join_modal() {
$("#joinModal").modal("show");
}
function hide_all_modal() {
$("#joinModal").modal("hide");
$("#signinModal").modal("hide");
}
</script>
<div class="container">
<div class="modal fade" id="joinModal" role="dialog">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
<form class="form-horizontal" method="post" action="controller.php">
<input type='hidden' name='page' value='StartPage'></input>
<input type='hidden' name='command' value='Join'></input>
<h1>Register</h1>
<div class="form-group">
<label class="control-label col-sm-2" for="username"> Username</label>
<div class="col-sm-10">
<input type="text" name="username" placeholder="Enter username.." required>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="password" required> Password</label>
<div class="col-sm-10">
<input name="password" type="password" placeholder="Enter password..">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="email" required> Email</label>
<div class="col-sm-10">
<input type="email" name="email" placeholder="Enter email..">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Submit</button>
<button type="cancel" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="modal fade" id="signinModal" role="dialog">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
<form class="form-horizontal" method="post" action="controller.php">
<input type='hidden' name='page' value='StartPage'></input>
<input type='hidden' name='command' value='SignIn'></input>
<h1>Login</h1>
<div class="form-group">
<label class="control-label col-sm-2" for="username"> Username</label>
<div class="col-sm-10">
<input type="text" name="username" placeholder="Enter username.." required>
<?php if (!empty($error_msg_username)) echo $error_msg_username; ?>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="password"> Password</label>
<div class="col-sm-10">
<input name="password" type="text" placeholder="Enter password.." required>
<?php if (!empty($error_msg_username)) echo $error_msg_username; ?>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Submit</button>
<button type="cancel" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
However, I could not get it to work.
Any ideas. Any sample code? Thanks in advance!

Replace this code with the current on your controller.
<script>
function show_login_modal() {
$("#loginModal").modal("show");
}
function show_signup_modal() {
$("#signupModal").modal("show");
}
function hide_all_modal() {
$("#signupModal").modal("hide");
$("#loginModal").modal("hide");
}
</script>
<?php
if (isset($display_type))
if ($display_type == 'signin')
echo '<script type="text/javascript">show_signin_modal();</script>';
else if ($display_type == 'join')
echo '<script type="text/javascript">show_join_modal();</script>';
//echo 'show_join_modal();';
else
;
?>

I found out how to do it with help from "https://codepen.io/elmahdim/details/azVNbN" which he posted on "Bootstrap modal: close current, open new" under username "Mahmoud". So in order to go from the joinModal window to the signinModal window right after the user submits the form on the joinModal window. I updated the submit button in the joinModal window with:
<button type="submit" class="btn btn-default" data-toggle="modal" data-target="#signinModal" data-dismiss="modal">Submit</button>

show validation in ajax in codeigniter

I have problem with ajax modal on my codeigniter project. I don't know why the submit button didn't work. the modal can be shown, but when I click the save button, nothing happens.
this is my javascript :
<script type="text/javascript" src="<?php echo site_url('assets/js/jquery.js'); ?>"></script>
<script src="<?php echo site_url('assets/js/bootstrap.min.js');?>"> </script>
<script type="text/javascript">
$('#submit').click(function() {
var form_data = {
name: $('#nama').val(),
email: $('#email').val(),
};
$.ajax({
url: "<?php echo site_url('adminproses/update'); ?>",
type: 'POST',
data: form_data,
success: function(msg) {
if (msg == 'YES')
$('#alert-msg').html('<div class="alert alert-success text-center">Your mail has been sent successfully!</div>');
else if (msg == 'NO')
$('#alert-msg').html('<div class="alert alert-danger text-center">Error in sending your message! Please try again later.</div>');
else
$('#alert-msg').html('<div class="alert alert-danger">' + msg + '</div>');
}
return false;
});
});
this my modal form :
<div class="modal fade" id="edit-modal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h3 class="modal-title">Detail Data Anda</h3>
</div>
<div class="modal-body form">
<form action="#" id="form" class="form-horizontal">
<input type="hidden" value="" name="id_user"/>
<div class="form-body">
<div class="form-group">
<label class="control-label col-md-3">Nomor Induk Pegawai</label>
<div class="col-md-9">
<input name="NIP" placeholder="Nomor Induk Pegawai" id="NIP" class="form-control" type="text" value="<?php echo $tampil['NIP'];?> ">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">Nama</label>
<div class="col-md-9">
<input name="nama" placeholder="Nama Lengkap Anda" id="nama" class="form-control" type="text" value="<?php echo $tampil['nama'];?>">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">Alamat</label>
<div class="col-md-9">
<textarea name="alamat" id="alamat" placeholder="Jalan A Nomor 1, Kelurahan A, Desa A, Kecamatan A, Kabupaten A, Provinsi A." class="form-control" ><?php echo $tampil['alamat'];?></textarea>
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">Nomor HP</label>
<div class="col-md-9">
<input name="no_hp" placeholder="081111111111" id="no_hp" class="form-control" type="text" value="<?php echo $tampil['no_hp'];?>">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">E-mail</label>
<div class="col-md-9">
<input name="email" placeholder="email#service.com" id="email" class="form-control" type="text" value="<?php echo $tampil['email'];?>">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">Kategori</label>
<div class="col-md-9">
<select name="id_katuser" class="form-control" id="kategori">
<option value="">Pilih Kategori</option>
<?php foreach ($katuser as $kat){?>
<option value="<?php echo $kat['id_katuser']; ?>" <?php if($kat['id_katuser']==$tampil['id_katuser']){echo "selected";}?>>
<?php echo $kat['nama_katuser']; ?></option>
<?php } ?>
</select>
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">Username</label>
<div class="col-md-9">
<input name="username" placeholder="Username" id="username" class="form-control" type="text" value="<?php echo $tampil['username'];?>">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">Password</label>
<div class="col-md-9">
<input name="password" placeholder="Password" id="password" class="form-control" type="text" value="<?php echo $tampil['password'];?>">
<span class="help-block"></span>
</div>
</div>
</div>
</form>
</div>
<div id="alert-msg"></div>
<div class="modal-footer">
<button type="button" id="btnSave" class="btn btn-primary">Save</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
and the controller :
public function update(){
//set validation rules
$this->form_validation->set_rules('NIP', 'nip', 'trim|required|xss_clean');
$this->form_validation->set_rules('nama', 'email', 'trim|required|xss_clean');
$this->form_validation->set_rules('alamat', 'alamat', 'trim|required|xss_clean');
$this->form_validation->set_rules('email', 'Emaid ID', 'trim|required|valid_email');
$this->form_validation->set_rules('no_hp', 'no_hp', 'trim|required|xss_clean');
$this->form_validation->set_rules('kategori', 'kategori', 'trim|required|xss_clean');
$this->form_validation->set_rules('username', 'username', 'trim|required|xss_clean');
$this->form_validation->set_rules('password', 'password', 'trim|required|xss_clean');
//run validation check
if ($this->form_validation->run() == FALSE){
//validation fails
echo validation_errors();
}
else{
//get the form data
$NIP = $this->input->post('NIP');
$nama = $this->input->post('nama');
$alamat = $this->input->post('alamat');
$no_hp = $this->input->post('no_hp');
$email = $this->input->post('email');
$id_katuser = $this->input->post('kategori');
$username = $this->input->post('username');
$password = $this->input->post('password');
}
}
Thank you for the help.

Use this to post the data
$('#btnSave').click(function(e) {
e.preventDefault();
var form_data = {
name: $('#nama').val(),
email: $('#email').val()
};
$.ajax({
url: '<?php echo site_url('adminproses/update'); ?>',
type: 'POST',
data: form_data,
success: function(msg) {
if (msg == 'YES')
$('#alert-msg').html('<div class="alert alert-success text-center">Your mail has been sent successfully!</div>');
else if (msg == 'NO')
$('#alert-msg').html('<div class="alert alert-danger text-center">Error in sending your message! Please try again later.</div>');
else
$('#alert-msg').html('<div class="alert alert-danger">' + msg + '</div>');
}
return false;
});
});

Categories