02-18-2018, 10:13 AM
Maybe this will help. Hope this provides a good example.
The view, complete with javascript
PHP Code:
class Multiselect extends CI_Controller
{
function __construct()
{
parent::__construct();
$this->load->helper('form');
}
function index()
{
$this->load->view('multiselect_v');
}
public function proc()
{
$data = $this->input->post('selector');
if($data)
{
foreach($data as $value)
{
switch($value)
{
case 'a':
$text = 'Apple';
break;
case 'b':
$text = 'Bannana';
break;
case 'c':
$text = 'Carrot';
break;
case 'd':
$text = 'Dates';
break;
}
$out[] = $text;
}
}
else
{
$out[] = "Nothing";
}
echo json_encode($out);
}
}
The view, complete with javascript
PHP Code:
<!DOCTYPE html>
<html>
<head>
<title>AJAX Multi-select</title>
<script src="https://code.jquery.com/jquery-2.2.2.js"></script>
</head>
<body>
<?php echo form_open('multiselect/proc', ['id' => "myForm"]); ?>
<div class="form-group">
<label class="checkbox-inline">
<?php
$options = [
'a' => 'alpha',
'b' => 'beta',
'c' => 'charlie',
'd' => 'delta',
];
echo form_multiselect('selector[]', $options, [], "id='mselect'");
?>
</div>
<input type="submit" value="Submit" id='submit'>
<?= form_close(); ?>
<p></p>
<script>
$('form').submit(function (event) {
event.preventDefault();
var postData = $(this).serializeArray();
$.ajax({
type: 'POST',
url: 'multiselect/proc',
data: postData,
datatype: 'json',
success: function (result) {
var ret = JSON.parse(result);
$("p").html("<b>You selected:</b> " + ret.join(", "));
},
error: function () {
alert('Fail ');
}
});
});
</script>
</body>
</html>
