このページhttp://loudev.com/から jQuery MultiSelect を使用しています- 視覚的にはすべて正常に動作しますが、選択された順序でデータを出力する必要があります。
この記事のjquery multiselect selected data orderに回避策が掲載されていますが、私はまったくの初心者であり、ソリューションを実装するには支援が必要です。
理想的には、選択した項目をテキスト フィールドに出力したいと考えています。どんな助けでも大歓迎です。
<html>
<link href="multiselect.css" media="screen" rel="stylesheet" type="text/css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.multiselect.js"></script>
<script type="text/javascript">
$(function() {
$('#keep-order').multiSelect({ keepOrder: true });
});
</script>
<script>
$(function(){
$('#keep-order').multiSelect({
afterSelect: function(value, text){
var get_val = $("#multiple_value").val();
var hidden_val = (get_val != "") ? get_val+"," : get_val;
$("#multiple_value").val(hidden_val+""+value);
},
afterDeselect: function(value, text){
var get_val = $("#multiple_value").val();
var new_val = get_val.replace(value, "");
$("#multiple_value").val(new_val);
}
});
});
</script>
</head>
<body>
<form method="post">
<select multiple="multiple" id="keep-order" name="keeporder[]">
<option value='elem_1'>elem 1</option>
<option value='elem_2'>elem 2</option>
<option value='elem_3'>elem 3</option>
<option value='elem_4'>elem 4</option>
<option value='elem_5'>elem 5</option>
<option value='elem_6'>elem 6</option>
<option value='elem_7'>elem 7</option>
<option value='elem_8'>elem 8</option>
<option value='elem_9'>elem 9</option>
<option value='elem_10'>elem 10</option>
</select>
<input type="hidden" name="multiple_value" id="multiple_value" />
<br/>
<input type="submit" name="submit" value="Submit" />
</form>
<?php
if(isset($_POST['submit'])){
$hidden = $_POST['multiple_value']; //get the values from the hidden field
$hidden_in_array = explode(",", $hidden); //convert the values into array
$filter_array = array_filter($hidden_in_array); //remove empty index
$reset_keys = array_values($filter_array); //reset the array key
var_dump($reset_keys); //the result
}
?>
</body>
</html>