Вставить в базу данных MySql из окна Javascript?

Question

С Рождеством все.

У меня есть календарь (главная страница), который, когда пользователь нажимает на кнопку, открывает окно (окно бронирования) в календаре, используя javascript, показывающий другую страницу php с формой бронирования (страница брони). У меня есть проверка javascript, установленная на главной странице, и все работает отлично.

Я не знаю, слишком ли херес или мой мозг на Рождество, но я не могу получить свою голову.

Когда пользователь нажимает кнопку отправки, вся страница обновляется, как и на стороне сервера, но я не уверен, что мне нужно сделать, чтобы только это окно обновлялось вместо всей страницы.

Есть ли другой способ, кроме использования Javascript для ввода данных на MySql? Я потерян.

Заранее спасибо :)

EDIT JAVASCRIPT КОД: -

var date = (thisId.id); 
var hr = new XMLHttpRequest(); 
var url = "Scripts/NewBooking.php"; 
var vars = "date="+date+"&jobtime="+jobtime; 
var jobtime = "Morning"; 
hr.open("POST", url, true); 
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
hr.onreadystatechange = function() { 
    if(hr.readyState == 4 && hr.status == 200) { 
     var return_data = hr.responseText; 
     document.getElementById("events").innerHTML = return_data; 
    } 
} 
hr.send(vars) 
document.getElementById("events").innerHTML = "processing..."; 

Answer 1

хорошо вам нужно использовать AJAX, чтобы сделать это .. AJAX позволит вам:

1. Обновление веб страница без перезагрузки страницы
2. Запросить данные с сервера - после загрузки страницы
3. Получение данных с сервера - после загрузки страницы
4. Отправить данные на сервер - в фоновом режиме

ваш код будет выглядеть примерно так:

$('#button').on('click',function(){ 
    $.ajax({ 
     url :'<?php echo site_url("your link goes here"); ?>', 
     type: "POST", 
     data : { 
      your_data : some_data 
     }, 
     success: function(data) 
     { 
      alert('success'); 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
      alert(xhr.status); 
      alert(xhr.responseText); 
      alert(thrownError); 
     } 
    }); 
});