[英]select option clears when page loads in php
the scenario is this: see select below 场景是这样的:见下面的选择
<form name="limit">
<select name="limiter" onChange="limit(this.value)">
<option selected="selected"> </option>
<option value="5">5</option>
<option value="10">10</option>
<option value="15">15</option>
</select>
</form>
I want whenever any option is selected for 3 things to happen: 我希望无论何时选择任何选项来实现3件事:
1.) js limit() function is called which all it does its takes current url, adds new query parameter 'limit' with the user selected value eg: 1.)调用js limit()函数,它只需要当前的url,用用户选择的值添加新的查询参数'limit',例如:
http://localhost/blahblah/apps/category.php?pg=1&catId=3021& limit=5
http://localhost/blahblah/apps/category.php?pg = 1&catId = 3021& limit = 5
(this will cause the category.php page to be hit and # of product displayed limited to the value selected by user) (这将导致命中category.php页面,并且显示的产品数量限制为用户选择的值)
2.)Once the url is hit, it reloads but i DONT want the value selected to reset back to the default (which it currently does).
2)一旦URL被击中,它重新加载,但我不想选择重置为默认值(它目前如此)的值。 I want it to reflect the users selection after page reload.
我想让它反映页面重新加载后的用户选择。
3.) Also, when i move to the next page (pagination), i would like the state to be carried ova to the next page (ie. remembering the user selection). 3.)此外,当我移动到下一页(分页)时,我希望将状态带到下一页(即记住用户选择)。
Just assign the selected value using PHP: 只需使用PHP分配所选值:
<form name="limit">
<select name="limiter" onChange="limit()">
<option <?php if(!isset($_POST['limiter'])) echo ' selected="selected"'; ?>> </option>
<option <?php if(isset($_POST['limiter']) && $_POST['limiter'] == 5) echo ' selected="selected"'; ?> value="5">5</option>
<option <?php if(isset($_POST['limiter']) && $_POST['limiter'] == 10) echo ' selected="selected"'; ?> value="10">10</option>
<option <?php if(isset($_POST['limiter']) && $_POST['limiter'] == 15) echo ' selected="selected"'; ?> value="15">15</option>
</select>
</form>
As the code gets hard to read, you could do a loop instead with PHP: 由于代码难以阅读,您可以使用PHP进行循环:
<form name="limit">
<select name="limiter" onChange="limit()">
<option <?php if(!isset($_POST['limiter'])) echo ' selected="selected"'; ?>> </option>
<?php foreach(array(5, 10, 15) as $p): ?>
<option <?php if(isset($_POST['limiter']) && $_POST['limiter'] == $p) echo ' selected="selected"'; ?> value="<?php echo $p; ?>">
<?php echo $p; ?>
</option>
<?php endforeach; ?>
</select>
</form>
<script type="text/javascript">
function limit(value)
{
url = "localhost/yourapp?limiter="+value;
}
</script>
<form name="limit">
<select name="limiter" onChange="limit(this.value)">
<option> </option>
<option value="5" <?php if($_REQUEST['limiter'] == 5) {echo "selected";}?>>5</option>
<option value="10" <?php if($_REQUEST['limiter'] == 10) {echo "selected";}?>>10</option>
<option value="15" <?php if($_REQUEST['limiter'] == 15) {echo "selected";}?>>15</option>
</select>
</form>
I am using $_REQUEST
here because I don't know your form's method. 我在这里使用
$_REQUEST
因为我不知道你的表单的方法。 Use accordingly. 相应地使用。
Tatu Ulmanen's answer handles the part of displaying select. Tatu Ulmanen的答案处理显示选择的部分。 To do the pagination part, simply pass the limit as a parameter in the query string.
要执行分页部分,只需将限制作为查询字符串中的参数传递。
For example, if you're currently using page links that look like this: 例如,如果您当前使用的页面链接如下所示:
<a href="http://localhost/blahblah/apps/category.php?pg=1&catId=3021">1</a>
Change them to include your limit parameter so it gets passed over: 更改它们以包含您的限制参数,以便它被传递:
<a href="http://localhost/blahblah/apps/category.php?pg=1&catId-3021&limit=5">1</a>
Just make sure to change your pagination code to account for the fact that each page is only "limit" items long. 只需确保更改您的分页代码,以解释每个页面只是“限制”项目的事实。 To help you do that, I need to know how you were doing your pagination.
为了帮助你做到这一点,我需要知道你是如何做你的分页。
can you check whether it works? 你能检查一下它是否有效吗?
<script type="text/javascript">
function limit(myvalue)
{
location.href="http://yoursite?limit="+myvalue;
}
function querySt() {
hu = window.location.search.substring(1);
gy = hu.split("&");
for (i=0;i<gy.length;i++) {
ft = gy[i].split("=");
if (ft[0] == 'limit') {
for (var idx=0;idx<document.getElementById('limiter').options.length;idx++) {
if (document.getElementById('limiter').value==ft[1]) {
document.getElementById('limiter').selectedIndex=idx;
}
}
}
}
}
</script>
</head>
<body onload="querySt()">
<form name="limits">
<select onchange="limit(this.value)" id="limiter">
<option selected="selected"> </option>
<option value="5">5</option>
<option value="10">10</option>
<option value="15">15</option>
</select>
</form>
</body>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.