admin管理员组文章数量:1323342
On my bootstrap model form with codeigniter if username was entered incorrect it should show message. But when if I click on button the bootstrap modal goes away even if validation errors are displayed
Goal: What I would like to be able to do is if any form validation true then will not close bootstrap modal but then if form_validation is OK then let me submit.
How to prevent the bootstrap modal from closing if any form validation error.
I have tried using e.preventDefault();
no luck
Model View
<?php if ($users) { ?>
<?php foreach ($users as $user) { ?>
<div class="modal fade" id="myModal-<?php echo $user['username']; ?>">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header clearfix">
<div class="pull-left">
<h2 style="font-size: 18px;">Are you absolutely sure?</h2></div>
<div class="pull-right">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
</div>
<div class="modal-body">
<div class="alert alert-warning text-center">
Unexpected bad things will happen if you don't read this!
</div>
<p class="text-center">If you delete this user, this user will not be able to login to the admin,
and all of his or her user information will be <b>Removed For Ever!</b>
</p>
<br/>
<p>Please type in the username of the user to confirm. <?php echo validation_errors('<div class="text-danger validation">', '</div>'); ?></p>
<form role="form" action="<?php echo $action;?>" method="post" enctype="multipart/form-data">
<div class="form-group">
<input type="text" id="input-user-<?php echo $user['username']; ?>" name="username" value="" class="form-control" />
<input type="hidden" name="user_id" value="<?php echo $user['user_id']; ?>" class="form-control" />
</div>
<div class="form-group text-center">
<button type="submit" id="button-delete-user-<?php echo $user['username']; ?>" class="btn btn-user-delete"><span class="text-danger">I understand the consequences, deleting this user</span></button>
</div>
</form>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- Bootstrap Model Form Validation Check -->
<script type="text/javascript">
$(document).ready(function(){
$('#button-delete-user-<?php echo $user['username']; ?>').on('click', function(e) {
e.preventDefault();
});
});
</script>
<!-- Enabled Submit Button If Text Is Entered In Input -->
<script>
$(document).ready(function(){
$('#button-delete-user-<?php echo $user['username']; ?>').attr('disabled',true);
$('#input-user-<?php echo $user['username']; ?>').keyup(function(){
if($(this).val().length !=0)
$('#button-delete-user-<?php echo $user['username']; ?>').attr('disabled', false);
else
$('#button-delete-user-<?php echo $user['username']; ?>').attr('disabled',true);
});
});
</script>
<?php }?>
<?php }?>
Controller Function Delete
public function delete() {
// Note: Form Validation Library Auto Loaded
$this->form_validation->set_rules('username', 'Username', 'required|callback_confirm_username_before_delete');
$this->form_validation->set_rules('user_id', 'User ID Number', 'required|callback_validateForm');
if ($this->form_validation->run($this) == FALSE) {
$this->get_list();
} else {
$this->delete_user();
$this->session->set_flashdata('info', 'Your user'.' '. $this->input->post('username') .' '.'was successfully deleted.');
redirect('admin/user/users');
}
}
On my bootstrap model form with codeigniter if username was entered incorrect it should show message. But when if I click on button the bootstrap modal goes away even if validation errors are displayed
Goal: What I would like to be able to do is if any form validation true then will not close bootstrap modal but then if form_validation is OK then let me submit.
How to prevent the bootstrap modal from closing if any form validation error.
I have tried using e.preventDefault();
no luck
Model View
<?php if ($users) { ?>
<?php foreach ($users as $user) { ?>
<div class="modal fade" id="myModal-<?php echo $user['username']; ?>">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header clearfix">
<div class="pull-left">
<h2 style="font-size: 18px;">Are you absolutely sure?</h2></div>
<div class="pull-right">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
</div>
<div class="modal-body">
<div class="alert alert-warning text-center">
Unexpected bad things will happen if you don't read this!
</div>
<p class="text-center">If you delete this user, this user will not be able to login to the admin,
and all of his or her user information will be <b>Removed For Ever!</b>
</p>
<br/>
<p>Please type in the username of the user to confirm. <?php echo validation_errors('<div class="text-danger validation">', '</div>'); ?></p>
<form role="form" action="<?php echo $action;?>" method="post" enctype="multipart/form-data">
<div class="form-group">
<input type="text" id="input-user-<?php echo $user['username']; ?>" name="username" value="" class="form-control" />
<input type="hidden" name="user_id" value="<?php echo $user['user_id']; ?>" class="form-control" />
</div>
<div class="form-group text-center">
<button type="submit" id="button-delete-user-<?php echo $user['username']; ?>" class="btn btn-user-delete"><span class="text-danger">I understand the consequences, deleting this user</span></button>
</div>
</form>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- Bootstrap Model Form Validation Check -->
<script type="text/javascript">
$(document).ready(function(){
$('#button-delete-user-<?php echo $user['username']; ?>').on('click', function(e) {
e.preventDefault();
});
});
</script>
<!-- Enabled Submit Button If Text Is Entered In Input -->
<script>
$(document).ready(function(){
$('#button-delete-user-<?php echo $user['username']; ?>').attr('disabled',true);
$('#input-user-<?php echo $user['username']; ?>').keyup(function(){
if($(this).val().length !=0)
$('#button-delete-user-<?php echo $user['username']; ?>').attr('disabled', false);
else
$('#button-delete-user-<?php echo $user['username']; ?>').attr('disabled',true);
});
});
</script>
<?php }?>
<?php }?>
Controller Function Delete
public function delete() {
// Note: Form Validation Library Auto Loaded
$this->form_validation->set_rules('username', 'Username', 'required|callback_confirm_username_before_delete');
$this->form_validation->set_rules('user_id', 'User ID Number', 'required|callback_validateForm');
if ($this->form_validation->run($this) == FALSE) {
$this->get_list();
} else {
$this->delete_user();
$this->session->set_flashdata('info', 'Your user'.' '. $this->input->post('username') .' '.'was successfully deleted.');
redirect('admin/user/users');
}
}
Share
Improve this question
edited May 8, 2015 at 11:32
asked May 8, 2015 at 7:01
user4419336user4419336
2
-
You're missing a closing bracket after the "validation" css declaration:
<?php echo validation_errors('<div class="text-danger validation">', '</div>'); ?>
– Mudshark Commented May 8, 2015 at 10:35 - bootstrap modal still does away though even with that fixed – user4419336 Commented May 8, 2015 at 10:38
1 Answer
Reset to default 3Error_validation
is a feature that CI provides.
You can only use error_validation
of code igniter when the page is submitted hence, the bootstrap modal is automatically closed because the page is getting submitted.
If you want to perform a form validation on a modal, it is better you use AJAX
If you want to show the error message above the form_open, just make a blank div like:
<div class='error_msg'>
</div>
and with jquery:
$(function(){
$('#form_id').submit(function(event){
event.preventDefault();
var custemail = $('#email_id').val();
var custname = $('#name').val();
$.ajax({
type: 'POST',
url: your controller path,
data: {
'name': custname,
'email': custemail
},
dataType: 'html',
success: function(results){
if(something not as you expected){
$('.error_msg').html('error msg');
return false;
}
}
});
});
});
本文标签: javascriptBootstrap Modal With Codeigniter Form ValidationStack Overflow
版权声明:本文标题:javascript - Bootstrap Modal With Codeigniter Form Validation - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742134602a2422314.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论