如何将列表框的值存储到数组中,然后使用它将其数据显示到另一个页面 php 中
How to store the values of listbox into an array then use it to display its data into another page php
我需要有关如何存储插入列表框中的数据的帮助。现在我有以下代码来创建列表。
<select name = "lstTerminals" size = "5" id="lstTerminals" multiple="multiple" style="width:200px;">
</select>
如您所见,它根本没有选项或值。为了填充列表,我有一个按钮,它可以根据文本字段的输入内容向其添加值。以下是用户可以在其中放置文本的文本字段
<input id="txtTerminal" type="text" name="txtTerminal" style="width:115px;"/>
下面的代码是按钮
<input class = "buttonDesign" id="btnAddTerminal" name ="btnAddTerminal" type="button" onclick = "javaScript:addTerminal();"
value="Add Terminal" style="width:110px; height:25px"/>
请注意,它有一个 onclick 方法,单击该方法时,它会将文本输入中的文本插入到我的列表框中。以下 onclick javaScript:addTerminal()
包含 javascript 代码:
function addTerminal() {
var terminal = document.getElementById('txtTerminal');
var terminals = document.getElementById('lstTerminals');
var values = new Array();
var option = document.createElement("option");
option.value = terminal.value;
option.text = terminal.value;
terminals.add(option);
return true;
}
一旦列表框被文本填满,我应该能够单独获取这些文本并移动到另一个页面以以某种方式显示每个文本。我现在的问题是如何将所有这些值(无需选择)存储在列表框中,并可能将其存储到数组中。完成此操作后,如何调用该数组并将其用于另一个页面以显示上一页的值?
可以创建一个全局变量并将数据保存在addTerminal 函数中然后你可以把它发布到PHP或存储在客户端本地存储中取决于浏览器是否支持本地存储。
var selectedTerminals = [];
function addTerminal() {
var terminal = document.getElementById('txtTerminal');
var terminals = document.getElementById('lstTerminals');
var values = new Array();
var option = document.createElement("option");
option.value = terminal.value;
option.text = terminal.value;
terminals.add(option);
savedData = {'value':terminal.value,'text':terminal.text};
selectedTerminals.push(savedData);
return true;
}
....
当你转到该事件中的第二页时,你应该有一些事件,你必须调用一些JS函数来决定数据存储在本地存储或PHP会话的位置:
function saveBeforeNavigation(){
if (typeof (Storage) !== 'undefined') {
// use local storage and save selected terminals in it
localStorage.setItem('selectedTerminals', JSON.stringify(selectedTerminals));
} else {
// post the data to the server and store it to DB / session / file
$.post('secondPage.php', {'selectedTerminals': selectedTerminals},function(result){if(result.status){alert('saved in session')}else{alert('was not saved in session')}},'json');
}
}
第二页.php
<?php
session_start();
// saving posted selectedTerminals
if (isset($_POST['selectedTerminals'])) {
$_SESSION['selectedTerminals'] = $_POST['selectedTerminals'];
echo json_encode(array('status' => 1));
die();
}
// when not posted here you get the selectedTerminal when nav executed
if (isset($_SESSION['selectedTerminals'])) {
echo '<script type="text/javascript">var selectedTerminals = JSON.parse(''' . json_encode($_SESSION['selectedTerminals']) . ''')</script>';
}
?>
<script type="text/javascript">
// get the selectedTerminals from the localStorage in case its exists
if(typeof(Storage) !== 'undefined'){
selectedTerminals = JSON.parse(localStorage.getItem('selectedTerminals'))
}
</script>
相关文章:
- 如何将json数据显示为html
- 解耦按钮(两个按钮同时切换),并根据数据显示相应的按钮
- 将json提要数据显示为html
- 使用Ajax Get方法将数据显示到特定元素中
- 如何将数据显示为线性highChart
- Json显示来自网站的数据显示仅未定义
- 使 ajax 请求和成功数据显示在 id <选择>选择>部分中
- 在按钮单击时将图像URL数据显示到弹出框中,而无需禁用背景
- 如何在循环中将 json 数据显示为 HTML
- 如何使用javascript在html中将firebase数据显示为列表
- PHP同时循环数组数据显示到javascript中
- 原始图像数据显示
- 如何在 y 轴上将数据显示为 KB、MB、GB、TB
- Ajax 数据显示在包含 10 行的表中
- 如何让 Mathjax.js 与 ANCII.js 将附加的 json 数据显示为正确的公式
- 调用 Worklight 适配器并将列表视图中的 JSON 数据显示为字符串
- Jquery/Javascript Datatables : 如何在行选择时将行数据显示到 html 文本字段中
- 双击 td 时,如何在警告框中将数据库中的数据显示为 html 表
- 日期之间的数据显示所有头
- 如何使用模板中的数据显示谷歌地图