Index.html
function drawChart() { var jsonData = $.ajax({ url: "server.php?startdate=" + start_date + "&enddate=" + end_date + "&type=" type, dataType: "json", async: false }).responseText; var obj = jQuery.parseJSON(jsonData); var data = google.visualization.arrayToDataTable(obj); (...)
Этот vars: start_date , end_date и тип должны быть получены формой без обновления страницы, поэтому я могу отправить ее на server.php и сделать некоторые вещи
Как я могу это сделать без изменения этой структуры jsonData и т. Д.?
Потому что мне нужно, чтобы строить диаграммы.
Спасибо еще раз 🙂 ps: Обратите внимание, если я не был чист 🙂
Представляя форму (например, приведенную ниже) на вашей странице, некоторые jQuery позволят вам захватить значения, введенные в текстовые поля, и сохранить в javascript-переменные, которые затем можно использовать в вашей функции drawChart ().
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $('#never_name_a_button_submit').click(function() { var start_date = $('start_date').val(); var end_date = $('end_date').val(); var type = $('type').val(); }); }); function drawChart() { var jsonData = $.ajax({ url: "server.php?startdate=" + start_date "&enddate=" + end_date + "&type=" type, dataType: "json", async: false }).responseText; var obj = jQuery.parseJSON(jsonData); var data = google.visualization.arrayToDataTable(obj); (...) </script> <form id="myForm"> <input type="text" name="start_date" id="start_date"><br /> <input type="text" name="end_date" id="end_date"><br /> <input type="text" name="type" id="type"><br /> <input type="button" id="never_name_a_button_submit"> </form>
Предполагая, что ваша форма имеет id
и каждый из ваших входов формы имеет name
вы можете использовать функцию jQuery serialize()
которая будет отправлять данные формы в URL-адрес вашего запроса ajax. Что-то вроде этого:
var jsonData = $.ajax({ url: "server.php", data: $('#myForm').serialize(), dataType: "json", async: false }).responseText;
Обратите внимание на добавление опции data
в вызов ajax, где #myForm
– это идентификатор вашей формы.
Так, например, если бы вы
<input type="text" name="start_date" />
в вашей форме запрос ajax будет фактически отправлен на server.php?start_date=2012-11-20