We Keep Coding

Two forms in a single page and with Bootsrap modal using Codeigniter

$('#form1').on('click',function(e){
e.preventDefault();
$('#emailModal').modal("show"); // open the modal
});
$(document).on('click','#sendEmail',function(){
$('#UpdateEmailModal').modal("show"); // open the modal
}
});
$(document).on('click','#UpdateSendEmail',function(){
$('#form1method').submit();
});
$(document).on('click','#Update_Close',function(){
$('#form2method').submit();
});
$(document).on('click','#Close',function(){
window.location = "<?php echo base_url(); ?>controller/page_method";
});
<!--Form 1-->
<form action="<?php echo base_url(); ?>mycontroller/method1" method="post" id="form1method">
<input type="text" name="name">
<input type="email" name="email">
<button type="submit" id="form1">Submit</button>
</form>
<!--Form 2 -->
<form action="<?php echo base_url(); ?>mycontroller/method2" method="post" id="form2method">
<input type="text" name="name">
<input type="email" name="email">
<button type="submit" id="form2">Submit</form>
</form>
<!--Modal 1 -->
<!--Email Modal -->
<div id="emailModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Send Email to User</h4>
</div>
<div class="modal-body">
<label class="col-md-3">To Email</label>
<div class="form-group col-md-9">
<input type="email" class="form-control" name="email_id" id="email_id" placeholder="Email ID">
</div>
<label class="col-md-3">Message</label>
<div class="form-group col-md-9">
<textarea name="message" id="message" class="form-control" placeholder="Message"></textarea>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-info btn-block" id="sendEmail"><strong>Update</strong></button>
<button class="btn btn-danger pull-right btn-block" data-dismiss="modal" id="Close"><strong>Close</strong></button>
</div>
</div>
</div>
</div>
<!--Modal 2 -->
<!--Email Status and Update Modal -->
<div id="UpdateEmailModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Update Form</h4>
</div>
<div class="modal-body">
<p>Click Submit to Update and Send Email (or) Click Cancel to Update</p>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-info btn-block" id="UpdateSendEmail"><strong>Submit</strong></button>
<button class="btn btn-danger pull-right btn-block" data-dismiss="modal" id="Update_Close"><strong>cancel</strong></button>
</div>
</div>
</div>
</div>
enter code here
<?php
*//My Controller*
public function method1(){
$result = $this->model->update_model();
if($result == true){
$this->session->set_flashdata("msg","post_page");
redirect("post_page");
}}
public function method2(){
$result = $this->model->update_model2();
if($result == true){
$this->session->set_flashdata("msg","post_page");
redirect("post_page");
}}
*`//My Model`*
public function update_model(){
$data = array(
'name' => $this->input->post("name"),
'email' => $this->input->post("email")
);
$this->db->update('user',$data);
}
public function update_model2(){
$data = array(
'name' => $this->input->post("name"),
'email' => $this->input->post("email"),
'status' => "1"
);
$this->db->update('user',$data);
}
?>
When clicking edit form, edit page will open, in that i have two forms (Form1 and Form2). Only one form should appear in a page. When i click submit of Form1 a Modal1 will open and clicking Update button the Modal2 will open. Based on the two buttons(Submit and Cancel) in Modal2 a response should happen. Like if i click "Submit" method2 in Controller should execute or else if i click method1 should execute. How do do it in Controller?. I don;t know if i doing it correctly. If you guys have any idea to solve this, please help me out.
Thanks in Advance

You can make each of your submit button with a different name. So when you press the submit button, like in the form1, form1submit_btn, the page reload and simply check the post input :
You button
<button type="submit" name="form1submit_btn" class="btn btn-info btn-block" id="sendEmail"><strong>Update</strong></button>
Both of your form action have the same action action="<?base_url("myController/method")?>, and you treat them directly in the controller :
function method(){
//form 1 has been submit
if($this->input->post("form1submit_btn")){
$result = $this->model->update_model();
if($result == true)
$this->session->set_flashdata("msg","post_page");
}
//form 2 has been submit
if($this->input->post("form2submit_btn")){
$result = $this->model->update_model2();
if($result == true)
$this->session->set_flashdata("msg","post_page");
}
redirect("post_page");
}

Processing form after modal submit in JSP

I am displaying a modal after a button click . The code of button for opening a modal is as follows :
<button type="button" name="btnEditIP" data-toggle="modal" data-target="#myModal" class="sultan_btn">Edit IP</button>\
The code of modal is as follows :
<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<form id="ipForm" class="form-horizontal" role="form" method="post" action="info_edit.jsp">
<div class="modal-header modal-header-warning">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title ">Please Enter IP Address</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label for="inputName">IP Address</label>
<input type="text" class="form-control" name="ip"/>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" name="btnSave" id="btnSave" class="btn btn-primary" data-dismiss="modal">Save</button>
</div>
</form>
</div>
</div>
In edit_info.jsp page, I am trying to determine whether the btnSave button is pressed by the following code :
if ((request.getParameter("btnSave") == null) ? false : true) {
out.println("Form submitted");
}
else{
out.println("Form not submitted");
}
Although , I am pressing the Save button in modal , I am always getting this message , "Form not submitted!" .That means , either the form is not submitted or there is an error in pressing button .
I am not sure where is the error . I have tried a lot but could not identified where is the error . Please help me to solve this error .

Please change request.getAttribute("btnSave") to request.getParameter("btnSave").
Because getParameter() returns http request parameters.
EDIT
I am not sure if one would see btnSave server side since the button
name would not be sent ?
We can use type="submit" to send the pressed button's name to the server.
<input type="submit" name="btnSave" value="SAVE"/>
Also Check:
Difference between getAttribute() and getParameter()
Difference between type='button' and type='submit'
How do I call a specific Java method on click/submit event of specific button in JSP?

passing a form data inside a modal into controller button outside the form without javascript

I am using Codeigniter Framework and now, i have a modal with a form inside of it. Now in my modal footer, i put the submit form for it. It is already outside of the modal. Now why is it doesn't submit in my controller?. I put a var_dump in my controller for it to echo when it was submitted, I am sending it thru without javascript.
Here is my modal with form:
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add Category</h4>
</div>
<div class="modal-body">
<div class="container-fluid">
<form id="frm_category" class="form-horizontal" method="POST" action="Admin_controls/insertCategory">
<div class="form-group">
<label for="cat_name">Category: </label>
<input type="text" class="form-control" name="cat_name">
</div>
<div class="form-group">
<label for="cat_desc">Description: </label>
<input type="text" class="form-control" name="cat_desc">
</div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success" value="submit" form="frm_category">Add</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
</div>
</div>
Here is my controller:
public function insertCategory() {
$data = array (
'Category_name' => $this->input->post('cat_name'),
'Category_desc' => $this->input->post('cat_desc')
);
var_dump($data);
}

You should place your submit button before </form>. other wise you need javascript to submit your form
you can use the following code
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add Category</h4>
</div>
<div class="modal-body">
<div class="container-fluid">
<form id="frm_category" class="form-horizontal" method="POST" action="Admin_controls/insertCategory">
<div class="form-group">
<label for="cat_name">Category: </label>
<input type="text" class="form-control" name="cat_name">
</div>
<div class="form-group">
<label for="cat_desc">Description: </label>
<input type="text" class="form-control" name="cat_desc">
</div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success" value="submit" onclick="myFunction()">Add</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
</div>
</div>
<script>
function myFunction() {
document.getElementById("frm_category").submit();
}
</script>

You should change the button type to submit. So it can submit the form.
Submit button should be inside of form tag
I have modified your modal code. And I hope it will work
×
Add Category
Category:
Description:
Add
Close

If you want to insert a data then you should follow this step:
To POST or GET you should have add that action attribute in side the <form> tag.
Now For post you need to give address of your controller into the <form action = "<?= base_url('your_controller/your_function') ?>" method="post">.
Now at the controller side:
public function your_function(){
// By using this you can get all posted data at once
$your_post_data = $this->input->post();
// By using this you get the post data seperatedly
$your_post_data = $this->input->post('user_name'); // your form input name
//Now for sending data to the model for database querys
$this->load->model ('your_model');
$data = $this->your_model->your_model_function($your_post_data);
}
if you don't want to load model every time then you can add the model in to __construct
public function __construct() {
parent::__construct ();
$this->load->model ('your_model');
// So now on you just need to call the model name in your function.
}
public function your_function(){
// By using this you can get all posted data at once
$your_post_data = $this->input->post();
// By using this you get the post data seperatedly
$your_post_data = $this->input->post('user_name'); // your form input name
$data = $this->your_model->your_model_function($your_post_data);
}
Now Inside the model:( i am giving example for insert)
public function your_model_function($your_post_data ){
$this->db->insert_batch('your_table_name', $your_post_data );
//If you want to understing of query execuation
// for thie you need to enable the log from config.php form config folde.
//Remove comment from log_message after emeble the log message
//log_message('debug', 'Last Insert query: ' . print_r($this->db->last_query(), TRUE).' Inserted Data: '.print_r($your_post_data, TRUE));
if($this->db->affected_rows() > 0){
return TRUE;
} else {
return FALSE;
}
}
For Mode detail regarding querys please visit this CI documentation
Your Code should be:
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add Category</h4>
</div>
<form id="frm_category" class="form-horizontal" method="POST" action="<?= base_utl('Admin_controls/insertCategory') ?>">
<div class="modal-body">
<div class="container-fluid">
<div class="form-group">
<label for="cat_name">Category: </label>
<input type="text" class="form-control" name="cat_name">
</div>
<div class="form-group">
<label for="cat_desc">Description: </label>
<input type="text" class="form-control" name="cat_desc">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success" value="submit" form="frm_category">Add</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
</div>
</form>
</div>
Your controller should be:
public function insertCategory() {
// You should have to validate befor insert
$this->load->model ('your_model');
$your_post_data = $this->input->post();
$insert_status = $this->your_model->your_model_function($your_post_data);
if($insert_status == TRUE){
//return to your view or load the view
$this->load->view ('your_view_directory');
} else {
// Send Error Message
}
For Validation Visit this CI documentation

Modal Dialog Validation ASP.NET/bootstrap

I've been trying to validate some control in a modal dialog for days now, and despite all the examples and other posts here on SO I can't seem to get it working...
In my webpage I have a button that opens a modal dialog. That modal dialog has three required input boxes: one for text and two for positive numeric values. I want to validate the inputs when the user clicks save using the fancy bootstrap feedback scheme like these examples:
http://formvalidation.io/examples/modal/
http://1000hz.github.io/bootstrap-validator/
If the input is valid then I'll take the values and process accordingly. I haven't gotten this far though. The modal does open currently.
I know these examples use forms, but since I'm using a master page, a nested form in my content page isn't allowed. So how can I validate the input and apply the feedback style to the invalid controls when the user clicks save?
<!-- Button to trigger modal -->
<button type="button" id="btnOpenModal" class="btn btn-info" data-toggle="modal" data-target="#myModal">Add</button>
<!-- Bootstrap Modal Dialog -->
<div class="modal fade" id="myModal" data-toggle="validator" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<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>
<h4 class="modal-title" id="myModalLabel">Here is the modal dialog</h4>
</div>
<div id="loginForm" class="modal-body form-horizontal">
<h5>Describe what to do here...</h5>
<div class="form-inline form-group">
<label for="mdltxtId" class="col-sm-3 control-label">Description</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="mdltxtId" name="mdltxtId" placeholder="item description" />
</div>
</div>
<div class="form-inline form-group">
<label for="mdltxtWgt" class="col-sm-3 control-label">Weight (LB)</label>
<div class="col-sm-9">
<input type="text" pattern="^[0-9]{1,}" title="Positive number only" class="form-control" id="mdltxtWeight" name="mdltxtWeight" placeholder="weight in pounds" />
</div>
</div>
<div class="form-inline form-group">
<label for="mdltxtLength" class="col-sm-3 control-label">Length (IN)</label>
<div class="col-sm-9">
<input type="text" pattern="^[0-9]{1,}" title="Positive number only" class="form-control" id="mdltxtLength" name="mdltxtLength" placeholder="length in inches" />
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<asp:Button ID="btnSave" runat="server" Text="Save" CssClass="btn btn-primary" />
<%--<button type="submit" class="btn btn-primary">Save changes</button>--%>
</div>
</div>
</div>
</div>
I probably could change the project to not use a master page to make life easier with forms - it's not required (default Web Forms project in VS2015 sets this up automatically).
Just to add...I'm primarily a VB.NET winforms developer so I'm probably missing a lot of fundamentals on ASP.NET and javascript so go easy on me.

Using the Bootstrap Validate plugin, you cannot validate input elements that are outside of a <form></form>. There is no workaround for this limitation.
with a Form id="Form"
<form id="Form">
<div class="modal-body form-horizontal">
<h5>Describe what to do here...</h5>
<div class="form-inline form-group">
<label for="mdltxtId" class="col-sm-3 control-label">Description</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="mdltxtId" name="mdltxtId" placeholder="item description" />
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<asp:Button ID="btnSave" runat="server" Text="Save" CssClass="btn btn-primary" />
<%--<button type="submit" class="btn btn-primary">Save changes</button>--%>
</div>
</form>
Fiddle with Form
When form id="Form" changed into a div id="Form" and now the same code cannot be validate by Bootstrap Validate plugin. The plugin does nothing without a <form></form>.
<div id="Form" class="modal-body form-horizontal">
<h5>Describe what to do here...</h5>
<div class="form-inline form-group">
<label for="mdltxtId" class="col-sm-3 control-label">Description</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="mdltxtId" name="mdltxtId" placeholder="item description" />
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<asp:Button ID="btnSave" runat="server" Text="Save" CssClass="btn btn-primary" />
<%--<button type="submit" class="btn btn-primary">Save changes</button>--%>
</div>
Fiddle with Div

So as Shehary pointed out the Bootstrap Validate plugin won't work on a modal dialog that is not a form. So to emulate the same effect, I added a span tag to each input to provide the feedback text and use javascript to to the validating and add the feedback styles.
Here is the modal:
<div class="modal fade" id="myModal" data-toggle="validator" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<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>
<h4 class="modal-title" id="myModalLabel">Here is the modal dialog</h4>
</div>
<div id="loginForm" class="modal-body form-horizontal">
<h5>Describe what to do here...</h5>
<div class="form-inline form-group">
<label for="mdltxtId" class="col-sm-3 control-label">Description</label>
<div class="col-sm-9">
<input type="text" pattern="^.{1,}" title="Item name required" class="form-control" id="mdltxtId" name="mdltxtId" placeholder="item description"/>
<span id="mdlIdHelper" class="help-block h6"></span>
</div>
</div>
<div class="form-inline form-group">
<label for="mdltxtWgt" class="col-sm-3 control-label">Weight (LB)</label>
<div class="col-sm-9">
<input type="text" pattern="^[+]?([.]\d+|\d+[.]?\d*)" title="Positive number only" class="form-control" id="mdltxtWeight" name="mdltxtWeight" placeholder="weight in pounds" />
<span id="mdlWgtHelper" class="help-block h6"></span>
</div>
</div>
<div class="form-inline form-group">
<label for="mdltxtArm" class="col-sm-3 control-label">Arm (IN)</label>
<div class="col-sm-9">
<input type="text" pattern="^[0-9]{1,}" title="Positive number only" class="form-control" id="mdltxtArm" name="mdltxtArm" placeholder="arm length in inches" />
<span id="mdlArmHelper" class="help-block h6"></span>
</div>
</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="btnmdlSave2" onclick="CloseModal(); return false;">Save</button>
</div>
</div>
</div>
</div>
And here is the javascript:
function OpenModal() {
//window.alert('opening modal');
ResetModal();
//window.alert('modal was reset');
$('#myModal').modal('show');
//window.alert('modal was opened');
}
function ResetModal() {
//window.alert('beginning modal reset');
var mdlId = $('#mdltxtId');
var mdlWgt = $('#mdltxtWeight');
var mdlArm = $('#mdltxtArm');
// reset the item description input group
mdlId.closest('.form-group').removeClass('has-error').removeClass('has-success');
mdlId.val('');
mdlIdHelper.innerHTML = "";
// reset the item weight input group
mdlWgt.closest('.form-group').removeClass('has-error').removeClass('has-success');
mdlWgt.val('');
mdlWgtHelper.innerHTML = "";
// reset the arm length input group
mdlArm.closest('.form-group').removeClass('has-error').removeClass('has-success');
mdlArm.val('');
mdlArmHelper.innerHTML = "";
//window.alert('finished modal reset');
}
function ValidateModal() {
var mdlId = $('#mdltxtId');
var mdlWgt = $('#mdltxtWeight');
var mdlArm = $('#mdltxtArm');
var val = true
// Check if the input is valid
if (!mdlId.val()) {
// Add errors highlight
mdlId.closest('.form-group').removeClass('has-success').addClass('has-error');
mdlIdHelper.innerHTML = "You must enter a description";
val = false
} else {
// Add success highlight
mdlId.closest('.form-group').removeClass('has-error').addClass('has-success');
mdlIdHelper.innerHTML = "";
}
// Check if the input is valid
if (!mdlWgt.val() || !$.isNumeric(mdlWgt.val()) || mdlWgt.val() <= 0) {
// Add errors highlight
mdlWgt.closest('.form-group').removeClass('has-success').addClass('has-error');
mdlWgtHelper.innerHTML = "Item weight must be a positive numeric value";
val = false;
} else {
// Add success highlight
mdlWgt.closest('.form-group').removeClass('has-error').addClass('has-success');
mdlWgtHelper.innerHTML = "";
}
// Check if the input is valid
if (!mdlArm.val() || !$.isNumeric(mdlArm.val()) || mdlArm.val() <= 0) {
// Add errors highlight
mdlArm.closest('.form-group').removeClass('has-success').addClass('has-error');
mdlArmHelper.innerHTML = "Arm length must be a positive numeric value";
val = false;
} else {
// Add success highlight
mdlArm.closest('.form-group').removeClass('has-error').addClass('has-success');
mdlArmHelper.innerHTML = "";
}
// return false if there was an error in the modal dialog. A FALSE return value will prevent a postback to the server. Might be redundant since the button onclick also has 'return false'.
return val;
}

I faced the same problem, probably it's too late but here is the code I did. It's useful if you don't care about use ajax and json...
<!-- Modal -->
<div class="modal fade" id="modalOption" tabindex="-1" role="dialog" aria-labelledby="modalOptionLabel">
<div class="modal-dialog" role="document">
<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>
<h4 class="modal-title" id="modalOptionLabel">Options</h4>
</div>
<div class="modal-body">
#using (Html.BeginForm("Save", "Option", FormMethod.Post, new { id = "frmTest" }))
{
Html.AntiForgeryToken();
<div class="row">
<div class="col-md-6">
<div class="col-md-6">
#Html.LabelFor(model => model.VALUE1)
#Html.TextBoxFor(model => model.VALUE1, String.Format("{0:#0.00}", Model.VALUE1), new { #class = "form-control input-decimal" })
#Html.ValidationMessageFor(model => model.VALUE1, "", new { #class = "label label-danger" })
</div>
</div>
<div class="col-md-6">
<div class="col-md-6">
#Html.LabelFor(model => model.VALUE2)
#Html.TextBoxFor(model => model.VALUE2, String.Format("{0:#0.00}", Model.VALUE2), new { #class = "form-control input-decimal" })
#Html.ValidationMessageFor(model => model.VALUE2, "", new { #class = "label label-danger" })
</div>
</div>
</div>
}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btn-sm" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary btn-sm crud-save" id="SaveOption" data-target="#modalOption" data-container="#divOptionGrid" form="frmTest">Save</button>
</div>
</div>
</div>
</div>
<script>
$(document).off('click', '.crud-save').on('click', '.crud-save', function (event) {
var formName = $(this).attr("form");
var form = $("#" + formName)
form.removeData('validator');
form.removeData('unobtrusiveValidation');
$.validator.unobtrusive.parse(form);
var isValid = $(form).validate().form();
if (!isValid) {
event.preventDefault();
return false;
}
var formInfo = form.serialize();
//here goes your ajax implementation
$.ajax({
type: form.attr('method'),
dataType: "json",//response by using json
url: form.attr('action'),
data: formInfo,
success: function (customJson) //just return a JsonResult from the controller if the process is successful
{
if(customJson.isDone){
alert("Done");
$("#modalOption").modal('hide');
}
else{
alert(customJson.errorMessage);
}
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(textStatus, errorThrown);
}
}
});
</script>

PHP not detect input name after check bootstrap confirm delete

I have this code for show confirm delete message before send form data:
JS:
$('input[name="S1"]').on('click', function (e) {
var $form = $(this).closest('form');
var checked = $("input:checked").length;
var action = $('select[name="todo"]');
if (action.val() === "delete" && checked) {
e.preventDefault();
$('#confirm').modal({
backdrop: 'static',
keyboard: false
})
.one('click', '#delete', function (e) {
$form.trigger('submit');
});
}
});
HTML Code:
<div class="panel-body">
<form method="POST" role="form" action="#">
<div class="row margin-bt-15">
<div class="col-md-6 col-sm-6 col-xs-12">
<select name="todo" class="contentgroup">
<option value="">choose</option>
<option value="delete">delete</option>
<option value="mark">mark</option>
<option value="unmark">unmark</option>
</select>
<input type="hidden" name="csrf_token" value="MTQzNjU3MDc3NjZPNXFKUmZWVlJWcE9ZNnd4VUZFbmRiSzMzSTZwMzRD">
<input type="submit" value="ok" class="btn btn-primary btn-sm" name="S1" />
</div>
</div>
</div>
<input type="checkbox" name="selected[]" class="check" value="4" />
</form>
</div>
<div id="confirm" class="modal fade in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">delete</h4>
</div>
<div class="modal-body text-center">
<i class="fa fa-exclamation-triangle text-danger fa-lg flashitmap"></i>
<label>message</label>
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-danger btn-sm" id="delete"><i class="fa fa-trash"></i>delete</button>
<button type="button" data-dismiss="modal" class="btn btn-sm">back</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
Now in PHP file i check $_POST using isset like this :
if ($_POST['todo'] && isset($_POST['S1']) && $_SERVER['REQUEST_METHOD'] == 'POST'){
echo 'true';
} else {
echo 'false';
always in result I see: false and my php code not detect isset($_POST['S1']) for my input name. how do can fix this ?
NOTE: when i remove bootstrap delete confirm, my form worked true and detect input name isset($_POST['S1']). I think my problem with bootstrap confirm code.
DEMO: http://jsfiddle.net/530j1hmp/2/

Apart form the things mentionned in the comments, there are several other to consider revision in your code.
$_POST['todo'] can be an empty string if the user has not selected an item, because there is value="". In PHP and other languages an empty string evaluates to false. Do you want it like this ?
if you have data in the $_POST array, then there it's a good bet your $_SERVER['REQUEST_METHOD'] equals 'POST'
To the main point: isset($_POST['S1']) will always be false. The element with name S1 is an input with type submit, and as such, it will be submitted ONLY if it is the submitter, ie only if it has been clicked. But with e.preventDefault(), you prevent that action, and the form is submitted through $form.trigger('submit');.
If you really need it, a solution could be to use a hidden field (type="hidden").
For more about which elements get submitted or not, you have the main rule on w3's site. Two other well known elements aren't submitted : radio button and checkbox if they have checkedness == false.