Используйте amsul pickdate в моих вызовах ajax

Question

Используйте amsul pickdate в моих вызовах ajax

Я пытаюсь использовать amsul datepicker (называемый pickdate), чтобы передать даты моему вызову ajax …

У меня есть два поля ввода (от и до):

<input id="from"> <input id="to">

Мой код Js:

var $input = $('#from').pickadate({
formatSubmit : 'yyyy-mm-dd',
format : 'fro!m: dd-mm-yyyy',
hiddenName : true
});
var $input = $('#to').pickadate({
formatSubmit : 'yyyy-mm-dd',
format : 'fro!m: dd-mm-yyyy',
hiddenName : true
});

Во-первых, я не знаю, как взять значения из pickadte и передать их в функцию show_ersults ниже …

И мой Ajax призыв к диаграмме Морриса:

function show_result(){
$.ajax({
url: 'ajax.php',
dataType: 'JSON',
type: 'POST',
data: {get_values: true},
success: function(response) {
Morris.Line({
element: 'morris-line-chart',
data: response,
xkey: 'Timestamp',
ykeys: ['Value'],
labels: ['Income Today'],
barColors: ['#2F2FFF'],
smooth: false,
resize: true
});
}
});}

(мое шоу URL будет похоже на URL: 'ajax.php?from='+ from...)

У меня вопрос, как я могу передать даты datepicker на мой вызов ajax ..

Мой PHP (я уже подготовил, я думаю) выглядит так:

<?php
error_reporting(0);
$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/database/db_connect.php";
include_once($path);

if (isset($_POST['from']) AND isset($_POST['to'])) {

$from = $_POST['from'];
$from = $_POST['to'];
$var = array();

$query = "SELECT Date as Timestamp, ROUND(Value,0) as Value
FROM KPI WHERE idName=6 AND Date >= '$from' AND Date <= '$to'"or die("Error in the consult.." . mysqli_error($link));

$result = $link->query($query);
while($obj = mysqli_fetch_object($result)) {
$var[] = $obj;
}
echo json_encode($var);
}

Ваша помощь будет оценена.
С наилучшими пожеланиями,
Даниил

0

datepicker jquery morris.js mysql php

Решение

Другие решения

Я сделал то же самое, что и вы, но вместо этого использовал Bootstrap datepicker. И я не использовал PHP.
Прежде всего вам нужно найти событие, когда вы выбираете день в Amsul datepicker, а затем передать его в вызов ajax. Я покажу вам небольшой пример использования даты и времени Морриса и Бутстрапа. Это прекрасно работает для меня.

HTML

<div class="ibox-content">
<div class="inner toast-bottom-full-width">
<label>Select a day</label>
<label for="fromdate" class='field prepend-icon'>
<i class="glyphicon glyphicon-calendar"></i>
<input type='text' id='fromdate' name="datepicker-from" style="width:90%" class="gui-input" data-date-format="yyyy-mm-dd" placeholder="" />
</label>
</div>

<div class="hr-line-dashed"></div>
<div id="morris-bar-chart"></div></div>

JavaScript

   function hourString(hour) {
if (hour === 0) {
return "12:00 am";
}
if (hour < 12) {
return hour + ":00 am";
}
if (hour === 12) {
return "12:00 pm";
}
return (hour - 12) + ":00 pm";
}

var ordersPackChart =
Morris.Bar({
element: 'morris-bar-chart',
data: [],
xkey: 'y',
ykeys: ['a'],
ymax: 1000,
labels: ['Pack per hour'],
hideHover: true,
resize: true,
barColors: ['#ed5565'],
parseTime: false
});

function packResult(historydate, result) {
result = JSON.parse(result);

var data = [];
for (var hour = 6; hour < 24; hour++) {

var numberPack = 0;
for (var i = 0; i < result.Result.length; i++) {
if (result.Result[i].PACK_HOUR == hour) {
numberPack = result.Result[i].NUM_ORDER_PACK;
break;
}
}

data.push({ y: hourString(hour), a: numberPack });
}

ordersPackChart.setData(data);
}


$(document).ready(function () {
$("#fromdate").datepicker({
autoclose: true
}).change(dateChanged)
.on('changeDate', dateChanged);
});

function dateChanged(ev) {
$(this).datepicker('hide');

var day = $('#fromdate').val();

$.ajax({
type: "GET",
url: '@Url.Action("GetQueryResult")',
context: document.body,
data: {
querySetName: 'dashboard-packorder-statistics',
queryName: 'OrderPack',
historydate: day
},
success: function (result) {
packResult(ordersPackChart.HISTORY_DATE, result);
},
error: function (xhr) {
var message = "ErrorStatus: " + xhr.status + "  ReadyState: " + xhr.readyState;
}
});
}

0

Источник

Accepted Answer

Чтобы отправить данные изменяет вызов ajax в параметре data:

function show_result(){
$.ajax({
url: 'ajax.php',
dataType: 'JSON',
type: 'POST',
data: {'from': $('#from').val(), 'to': $('#to').val()},
success: function(response) {
Morris.Line({
element: 'morris-line-chart',
data: response,
xkey: 'Timestamp',
ykeys: ['Value'],
labels: ['Income Today'],
barColors: ['#2F2FFF'],
smooth: false,
resize: true
});
}
});}

И измените это на сервере:

 $from = $_POST['from'];
$to   = $_POST['to'];

0