我创建了带有过滤器按钮的搜索栏,可以在教师和学生姓名之间进行搜索。首先,我可以通过修复学生来搜索我的数据库,但是当我尝试使用过滤器按钮时,没有任何从下拉按钮发送值 所以这是我糟糕的代码,请来帮我
.HTML:
<form method="post" action="<?php echo $_SERVER['SCRIPT_NAME']; ?>">
<div class="input-group">
<div class="input-group-btn search-panel">
<button name="filter" type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#" id="dropdownMenu1">
<span class="selection pull-left">Select an option</span></button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1" style="box-shadow:0px 6px 12px rgba(0, 0, 0, 0.176)">
<li><a href="#Teacher" class="" data-value="Teacher"><span>Teacher</span></a></li>
<li><a href="#Student" class="" data-value="Student"><span>Student</span></a></li>
<li class="divider"></li>
<li><a href="#all">All</a></li>
</ul>
</div>
<!-- <input type="hidden" name="search_param" value="all" id="search_param"> -->
<input name="txtSearch" type="text" class="form-control" id="txtSearch" placeholder="Search term..."
value="<?php echo $wordSearch; ?>">
<span class="input-group-btn">
<button id="btnSearch" class="btn btn-primary" type="submit">
<span class="glyphicon glyphicon-search"></span></button>
</span>
</div>
</form>
这是我的 JS
<script type="text/javascript">
$(".dropdown-menu").on('click', 'li a', function(){
var selText = $(this).children("span").html();
$(this).parent('li').siblings().removeClass('active');
$('#vl').val($(this).attr('data-value'));
$(this).parents('.input-group-btn').find('.selection').html(selText);
$(this).parents('li').addClass("active");
});
</script>
我对PHP一无所知所有内容都在同一页面下(请参阅下面的附图)http://upic.me/i/hg/ssssss.jpg
链接不是表单元素。您需要告诉表单字段(它将发送值 - 与链接相比)有关该值的信息。实际上,您已经在javascript中用这一行执行此操作:
$('#vl').val($(this).attr('data-value'));
现在,您只需要在表单中创建相应的表单字段(属性 id="vl")。在此示例中,使用如下所示的"隐藏"表单字段。只需在标签之间的某个位置添加以下内容:
<input type="hidden" id="vl" name="vl" value="">
然后你可以用以下命令在 PHP 中获取值:
$_POST['vl']
如果您正在考虑将数据发布到后端进行搜索,则需要 ajax 帖子来执行此操作 asyc(类似于 jquery ajax 方法)文档在这里
如果你想使用一个表单,你需要阅读HTML表单,在你开始PHP方面之前,这里有MDN文档