Как связано datepicker с ajax livesearch

У меня проблема и я буду рад, если вы поможете. Я хочу использовать datepicker и ajax livesearch вместе на веб-сайте для окна поиска. Когда дата вводится в окно поиска вручную, она добавляется в окно поиска и поиск завершается. если я выберу дату в окне выбора даты, она отобразится в поле поиска, но поиск в реальном времени не работает или не выполняет поиск. насколько я понимаю, результат datepicker не обрабатывается livesearch. Я думаю, мне нужен javascript для получения данных друг от друга, но я не могу. Жду вашей помощи. Следующие коды актуальны. Спасибо.

<!doctype html>
<html lang = "en">
<head>
    <meta charset = "utf-8">
    <meta name = "viewport" content = "width=device-width, initial-scale=1, shrink-to-fit=no">

    <link href = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.min.css" rel = "stylesheet"/>
    <link href = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel = "stylesheet" integrity = "sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin = "anonymous">
	
<script>
function showResult(str) {
  if (str.length==0) { 
    document.getElementById("livesearch").innerHTML = "";
    document.getElementById("livesearch").style.border = "0px";
    return;
  }
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {  // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
    if (this.readyState==4 && this.status==200) {
      document.getElementById("livesearch").innerHTML=this.responseText;
      document.getElementById("livesearch").style.border = "1px solid #A5ACB2";
    }
  }
  xmlhttp.open("GET","livesearch.php?q = "+str,true);
  xmlhttp.send();
}
</script>
</head>
	<body>

<div class = "container">
    <div class = "row" style = "padding-top: 10px">
        <div class = "col">
            <input type = "text" size = "30" onkeyup = "showResult(this.value)" id = "datepicker">
        </div>
		<div id = "livesearch"></div>
    </div>
 </div>
		

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.min.js"></script>
<script src = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity = "sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin = "anonymous"></script>
<script type = "text/javascript">
    $('#datepicker').datepicker({
        weekStart: 1,
        daysOfWeekHighlighted: "6,0",
        autoclose: true,
        todayHighlight: true,
		format: "dd.mm.yyyy",
		clearBtn: true,
        language:  'tr',
        todayBtn:  true,
		autoclose: false,
		dayofweekhiglight: true,
    });
    $('#datepicker').datepicker("setDate", new Date());
	

	
</script>
</body>
</html>
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
92
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

У начальной загрузки datepicker есть событие changeDate, которое вы можете использовать для вызова вашей функции showResult. См. https://bootstrap-datepicker.readthedocs.io/en/latest/events.html#changedate

Я не знаю, как вызвать функцию showresult. так что дайте мне дополнительную информацию, пожалуйста ... Спасибо за ответ

byrolizac 09.12.2018 18:56

Вы пытались привязать событие изменения к средству выбора? См. Пример здесь: jsbin.com/pusatopiza/edit?html,js,console,output. Я удалил событие inline keyup, поскольку оно запускает функцию без необходимости при каждой нажатой клавише.

Steve T 09.12.2018 19:11

Другие вопросы по теме