Запрос MySql при наведении курсора на Div - PullRequest
2 голосов
/ 06 октября 2011

У меня есть календарь, который я создаю с событиями для определенных дней, хранящихся в mysql.

Я пытаюсь сделать так, чтобы, когда пользователь наводил курсор на определенный день в календаре, он запрашивал mysql.и получить и отобразить эти события для этого дня в div под календарем.Есть идеи?

Вот что-то грубое ::

<div class='calendar'>
 ..
 ..
 <div class='cal-day'>
  this is div that I want to initiate the hover 
  so when a user hovers over this div,mysql gets 
  queried and sends the results to the results div
 </div>
</div>

<div id='results>
 show results here
</div>

Ответы [ 5 ]

4 голосов
/ 06 октября 2011

Вам нужен еще один атрибут в div, который будет содержать дату.

после того, как кто-то наведет курсор на div ajax, выдаст результат.

Div должен быть

<div class='cal-day' rel="2011-10-10">
  this is div that I want to initiate the hover 
  so when a user hovers over this div,mysql gets 
  queried and sends the results to the results div
 </div>

JQuery

$('.cal-day').mouseover(function() {
  $('#result').load('ajax/result.php?date='+$(this).attr('rel');
});
1 голос
/ 06 октября 2011

Создание страницы PHP, которая принимает дату в качестве параметра GET, а затем на основе заданного дня генерирует вывод HTML, который должен отображаться в выводе. Это легко сделать с помощью jQuery, используя функцию $.load:

$('#cal-day-id').load(
    // the url of the AJAX request that will retrieve data
    'calinfo.php',

    // this would be dynamically calcaluated based
    // on which day they are hovering over
    { date: '2011-10-06' }
);

calinfo.php может выглядеть примерно так:

$thedate = $_GET['date'];
// connect to db
$result = mysql_query('select * from events where date = ?');
// get results and display in HTML format for embedding on page
while ($row = mysql_fetch_assoc($result)) {
    echo '<p>Event: '. $row['name']. '</p>';
    echo '<p>Description: '. $row['description']. '</p>';
}
0 голосов
/ 06 октября 2011

На самом деле вы не можете напрямую общаться с MySQL из интерфейсного HTML, поэтому вам понадобится промежуточный уровень (серверная технология, такая как Java / PHP / RoR и такая, в которой есть драйвер MySQL).

После того, как у вас есть контроллер на стороне сервера, вы можете установить divin mousein и mouseout events (или jQuery hover), чтобы сделать AJAX-вызов на сервер и получить список дней.

0 голосов
/ 06 октября 2011

Вам понадобится AJAX, чтобы выполнить это. Установите атрибут «onmouseover», указывающий на некоторый Javascript, который делает HTTP-запрос для получения ваших данных, а затем используйте функцию обратного вызова для обновления результатов div.

0 голосов
/ 06 октября 2011

Просто сделайте ajax-запрос к php-скрипту, который получит результаты из mysql и отправит их в браузер. Вы можете использовать функцию jQuery $.ajax(). Google это:)

...