我有一个将所选值发送到控制器的选择表单,以及一个将两个值发送到同一个控制器的表单模式,所有这两个将使用jquery函数发送它们的数据! 这是我的代码:
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="form-group">
<h3>Veuillez choisir un cycle :</h3><br/>
<label>Cycle: </label>
<form method="post" accept-charset="utf-8">
<select name="cyc" id ="Select1" class="input-small">
<?php foreach($cycle as $row) {?>
<option value="<?php echo $row->id; ?>"><?php echo $row->libelle; ?></option>
<?php }?>
</select>
</form>
<button class="btn btn-success" onclick="display()"><i class="glyphicon glyphicon-plus"></i> display</button>
</div>
<div id="x" style="display:none;" class="container">
</center>
<button class="btn btn-success" onclick="add_filiere()"><i class="glyphicon glyphicon-plus"></i> Ajouter une filiere</button>
<br />
<br />
<table id="table_id" class="table table-striped table-bordered" cellspacing="0" width="100%">
<thead>
<tr>
<th>Identifiant</th>
<th>Identifiant du cycle</th>
<th>Libellé</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php foreach($filiere as $row){?>
<tr>
<td><?php echo $row->id;?></td>
<td><?php echo $row->id_cycle;?></td>
<td><?php echo $row->libelle;?></td>
<td>
<button class="btn btn-warning" onclick="edit_filiere(<?php echo $row->id;?>)"><i class="glyphicon glyphicon-pencil"></i></button>
<button class="btn btn-danger" onclick="delete_filiere(<?php echo $row->id;?>)"><i class="glyphicon glyphicon-remove"></i></button>
</td>
</tr>
<?php }?>
</tbody>
</table>
</div>
<script src="<?php echo base_url('assests/datatables/js/jquery.dataTables.min.js')?>"></script>
<script src="<?php echo base_url('assests/datatables/js/dataTables.bootstrap.js')?>"></script>
<script type="text/javascript">
$(document).ready( function () {
$('#table_id').DataTable( {
"lengthMenu": [[5,10, 25, 50, -1], [5,10, 25, 50, "All"]]
});
} );
var save_method; //for save method string
var table;
function add_filiere()
{
save_method = 'add';
$('#form')[0].reset(); // reset form on modals
$('#modal_form').modal('show'); // show bootstrap modal
//$('.modal-title').text('Add Person'); // Set Title to Bootstrap modal title
}
function display()
{
/* var ic = document.getElementById('cyc').value;
document.getElementById('x').style.display = 'block';
$.ajax({
url : "<?php echo site_url('index.php/filiere/test') ?>",
type :"POST",
data :{ic: ic},
success: function(data)
{
},
error : function(jqXHR, textStatus, errorThrown)
{
alert('cannot reach controller');
}
});*/
}
function edit_filiere(id)
{
save_method = 'update';
$('#form')[0].reset(); // reset form on modals
//Ajax Load data from ajax
$.ajax({
url : "<?php echo site_url('index.php/filiere/filiere_edit/')?>/" + id,
type: "GET",
dataType: "JSON",
success: function(data)
{
$('[name="i"]').val(data.id);
$('[name="l"]').val(data.libelle);
$('#modal_form').modal('show'); // show bootstrap modal when complete loaded
$('.modal-title').text('Modifier département'); // Set title to Bootstrap modal title
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Error get data from ajax');
}
});
}
function save()
{
var url;
if(save_method == 'add')
{
url = "<?php echo base_url('index.php/filiere/filiere_add')?>";
}
else
{
url = "<?php echo base_url('index.php/filiere/filiere_update')?>";
}
// ajax adding data to database
$.ajax({
url : url,
type: "POST",
data: $('#form').serialize(),
dataType: "JSON",
success: function(data)
{
//if success close modal and reload ajax table
$('#modal_form').modal('hide');
location.reload();// for reload a page
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Error adding / update data');
}
});
}
function delete_filiere(id)
{
if(confirm('Voulez vous supprimer ce filiere ?'))
{
// ajax delete data from database
$.ajax({
url : "<?php echo site_url('index.php/filiere/filiere_delete')?>/"+id,
type: "POST",
dataType: "JSON",
success: function(data)
{
location.reload();
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Error deleting data');
}
});
}
}
</script>
<!-- Bootstrap modal -->
<div class="modal fade" id="modal_form" 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">Départements</h3>
</div>
<div class="modal-body form">
<form action="#" id="form" class="form-horizontal">
<div class="form-body">
<div class="form-group">
<label class="control-label col-md-3">Identifiant</label>
<div class="col-md-9">
<input name="i" placeholder="Identifiant" class="form-control" type="text">
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">Libelle</label>
<div class="col-md-9">
<input name="l" placeholder="Nom" class="form-control" type="text">
</div>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" id="btnSave" onclick="save()" 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 -->
<!-- End Bootstrap modal -->
</body>
</html>
我的控制器:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Filiere extends CI_Controller {
/**
* Index Page for this controller.
*
* Maps to the following URL
* http://example.com/index.php/welcome
* - or -
* http://example.com/index.php/welcome/index
* - or -
* Since this controller is set as the default controller in
* config/routes.php, it's displayed at http://example.com/
*
* So any other public methods not prefixed with an underscore will
* map to /index.php/welcome/<method_name>
* @see https://codeigniter.com/user_guide/general/urls.html
*/
public function __construct()
{
parent::__construct();
$this->load->helper('url');
$this->load->model('filiere_model');
$this->load->model('cycle_model');
}
public function index()
{
$this->data["cycle"] = $this->cycle_model->get_all_cycle();
$id_cycle = "";
$this->data['filiere'] = $this->filiere_model->get_all_filiere($id_cycle);
$this->data["title"] = "Gérer les filieres";
$this->data["page"] = $this->load->view('filiere_view',$this->data,true);
$this->load->view("default",$this->data);
}
public function test()
{
$id_cycle = $_POST['ic'];
$this->data['x']= $id_cycle;
$this->data["page"] = $this->load->view('test_view',$this->data,true);
$this->load->view("default",$this->data);
}
public function filiere_add()
{
$data = array(
'id' => $this->input->post('i'),
'id_cycle' => $this->input->post('cyc'),
'libelle' => $this->input->post('l'),
);
$insert = $this->filiere_model->filiere_add($data);
echo json_encode(array("status" => TRUE));
}
public function filiere_edit($id)
{
$data = $this->filiere_model->get_by_id($id);
echo json_encode($data);
}
public function filiere_update()
{
$data = array(
'id' => $this->input->post('i'),
'libelle' => $this->input->post('l')
);
$this->filiere_model->filiere_update(array('id' => $this->input->post('i')), $data);
echo json_encode(array("status" => TRUE));
}
public function filiere_delete($id)
{
$this->filiere_model->delete_by_id($id);
echo json_encode(array("status" => TRUE));
}
}
请帮忙!
答案 0 :(得分:1)
控制器:
$this->input->post('name');
$this->input->post('location');
的Ajax:
$.ajax({
method: "POST",
url: "your/controller",
data: { name: "John", location: "Boston" }
})
.done(function( msg ) {
alert( "Data Saved: " + msg );
});