我从这里使用Ajax Live Search:http://ajaxlivesearch.com/来搜索我的数据库中的城市 我在模态弹出窗口中打开搜索表单。如果我开始输入表格给我所有结果,从我在表格中输入的第一个字母开始。我可以选择所需的城市,它将在文本字段中设置。 现在我想要绘制值并将其发布在主页面上,我打开弹出窗口。 但似乎没有任何效果。 提供更好的图像,我会发布更多的代码。如果有这么多的话,请原谅我。 :)
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="/css/mailopen.css" type="text/css">
<link rel="stylesheet" href="/css/styles.css" type="text/css">
<link rel="stylesheet" href="css/modality.css">
<link rel="stylesheet" href="css/jquery-ui-1.10.3.custom.min.css" />
<script src="js/jquery-ui-1.10.3.custom.min.js"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#getcity').click(function () {
$("#ls_query").html("");
$(':input').each(function (index) {
console.log($(this));
$("#ls_query").append("<b>Input Type:</b> " + $(this).attr('type') + " ");
});
});
});
</script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div id="body_box_tabs">
<ul class="tabs" data-persist="true">
<li class="selected"><a href="#view1">Mitgliedersuche</a></li>
<li><a href="#view2">Erweiterte Suche</a></li>
</ul>
<div class="tabcontents">
<div id="view1">
<p style="color: #05296B; font-weight: bold;">In:
<div id="ls_query"></div>
<button class="my_popup_open">Ort suchen</button></div></div>
<div id="my_popup">
<?php include 'citysearch.php'; ?>
</div>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="js/index.js"></script>
<script src="js/jquery.popupoverlay.js"></script>
<script>
$(document).ready(function () {
$('#my_popup').popup();
});
</script>
在<div id="ls_query"></div>
我希望显示搜索结果。
所以这是在弹出窗口中打开的搜索页面
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/modality.css">
<link rel="stylesheet" href="css/jquery-ui-1.10.3.custom.min.css" />
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="js/jquery-ui-1.10.3.custom.min.js"></script>
<?php file_exists(__DIR__ . DIRECTORY_SEPARATOR . 'class' . DIRECTORY_SEPARATOR . 'handler.php') ? require_once(__DIR__ . DIRECTORY_SEPARATOR . 'class' . DIRECTORY_SEPARATOR . 'handler.php') : die('There is no such a file: handler.php');
file_exists(__DIR__ . DIRECTORY_SEPARATOR . 'class' . DIRECTORY_SEPARATOR . 'config.php') ? require_once(__DIR__ . DIRECTORY_SEPARATOR . 'class' . DIRECTORY_SEPARATOR . 'config.php') : die('There is no such a file: config.php');
?>
<link href='http://fonts.googleapis.com/css?family=Quattrocento+Sans:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/fontello.css">
<link rel="stylesheet" href="css/animation.css">
<!--[if IE 7]>
<link rel="stylesheet" href="css/fontello-ie7.css">
<![endif]-->
<link rel="stylesheet" type="text/css" href="css/style.min.css">
<div class="ls_container">
<!-- Search Form -->
<form accept-charset="UTF-8" class="search" id="ls_form" name="ls_form">
<?php
Handler::get_javascript_anti_bot();
?>
<input type="hidden" name="ls_anti_bot" id="ls_anti_bot" value="">
<input type="hidden" name="ls_token" id="ls_token" value="<?php echo Handler::get_token(); ?>">
<input type="hidden" name="ls_page_loaded_at" id="ls_page_loaded_at" value="<?php echo time(); ?>">
<input type="hidden" name="ls_current_page" id="ls_current_page" value="1">
<input type="text" name="ls_query" id="ls_query" placeholder="gesuchter Ort" autocomplete="off" maxlength="<?php echo Config::MAX_INPUT_LENGTH; ?>">
<div id="ls_result_div">
<div id="ls_result_main">
<table>
<tbody>
</tbody>
</table>
</div>
<div id="ls_result_footer">
<div class="col page_limit">
<select id="ls_items_per_page" name="ls_items_per_page">
<option value="5" selected>5</option>
<option value="10">10</option>
<option value="0">Alle</option>
</select>
</div>
<div class="col navigation">
<i class="icon-left-circle arrow" id="ls_previous_page"></i>
</div>
<div class="col navigation pagination">
<label id="ls_current_page_lbl">1</label> / <label id="ls_last_page_lbl"></label>
</div>
<div class="col navigation">
<i class="icon-right-circle arrow" id="ls_next_page"></i>
</div>
</div>
</div>
</form>
<input id="getcity" class="my_popup_close" type="submit" value="Übernehmen" >
</div>
<script src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/script.min.js"></script>
<input id="getcity" class="my_popup_close" type="submit" value="Übernehmen" >
我希望获得价值。
但没有任何作用。或者还有其他方法可以获得价值吗?我现在挂了3天没有结果
答案 0 :(得分:0)
保持
<input id="getcity" class="my_popup_close" type="submit" value="Übernehmen" >
在<form></form>
标记内。这样您就可以在表单提交后收集价值。
答案 1 :(得分:0)
如果您使用的是最新版本,则可以使用自定义活动onResultClick
和onResultEnter
来访问所选的值,如下所示:
jQuery(".mySearch").ajaxlivesearch({
loaded_at: <?php echo time(); ?>,
token: <?php echo "'" . $handler->getToken() . "'"; ?>,
max_input: <?php echo Config::getConfig('maxInputLength'); ?>,
onResultClick: function(e, data) {
// get the index 1 (second column) value
var selectedOne =
jQuery(data.selected).find('td').eq('1').text();
// set the input value
jQuery('#ls_query').val(selectedOne);
// hide the result
jQuery("#ls_query").trigger('ajaxlivesearch:hide_result');
},
onResultEnter: function(e, data) {
// do whatever you want
// jQuery("#ls_query").trigger('ajaxlivesearch:search', {query:
'test'});
}
});
干杯,