СМОТРИТЕ РЕДАКТИРОВАТЬ ДЛЯ БОЛЬШЕ ТЕКУЩЕЙ ИНФОРМАЦИИ
Я видел несколько похожих постов, но ни один из них не обязательно отвечал на мои вопросы. Я создал пару сценариев для тестирования этого процесса, просто чтобы получить базовые знания.
Ниже вы увидите два файла (ajax_test.php & ajax_test2.php). Первый - это инициализация некоторых значений, которые будут использоваться в диаграмме (vals_a, vals_b, vals_c). Эти значения отправляются клиенту только один раз. Кнопка (TEST) при нажатии запускает функцию js test(), которая должна destroy текущий график и начинает наш запрос ajax. Запрос должен вызвать функцию php (test2()). Эта функция в настоящее время пуста, потому что все, что я пытался сделать, было неверным. То, что должна делать эта функция (test2()), теперь устанавливает мои js переменные (vals_a, vals_b, vals_c) в значения $new_a, $new_b, и $new_c. Как только это будет сделано, последняя часть моей функции ajax success должна заново создать диаграмму с нашими новыми значениями, используя draw()
ajax_test.php
<?php
$vals_a = [1,2,3];
$vals_b = [4,5,6];
$vals_c = [7,8,9];
$i=false;
while($i!==true){
echo '<script> var vals_a = '.json_encode($vals_a).';</script>';
echo '<script> var vals_b = '.json_encode($vals_b).';</script>';
echo '<script> var vals_c = '.json_encode($vals_c).';</script>';
echo '<script>console.log(vals_a);</script>';
echo '<script>console.log(vals_b);</script>';
echo '<script>console.log(vals_c);</script>';
$i=true;
}
?>
<button onclick="test()">TEST</button>
<script src="vendor/jquery/jquery.min.js"></script>
<script>
function test(){
chart.destroy();
$.ajax({
url:"ajax_test2.php",
type: "POST",
data: {call: "test2"},
success: function(output){
//missing steps ..
//
// should accept new vals
//
console.log(vals_a);//should = $new_a
console.log(vals_b);//should = $new_b
console.log(vals_c);//should = $new_c
draw();
}
});
}
</script>
ajax_test2.php
<?php
$new_a = [9,8,7];
$new_b = [6,5,4];
$new_c = [3,2,1];
if(isset($_POST['call'])){
if($_POST['call']=='test2'){
test2($new_a, $new_b, $new_c);
}
}
function test2(){
//missing steps...
//
//s
}
?>
РЕДАКТИРОВАТЬ 1
Первоначально я ожидал, что смогу установить значения с помощью test2 изатем echo их при отправке моего output на определенный div, а затем воссоздание диаграммы с этими новыми значениями. Однако новый график все еще использовал предыдущие значения. Когда я добавил свой console.log(*my var*) в конце моего success, он все еще показывал и предыдущие значения, но мой div содержал правильные значения`.
В конечном итоге я просто хочу использовать ajax чтобы вызвать php функцию, чтобы изменить мои js значения и затем перезагрузить мои диаграммы с правильными значениями.
РЕДАКТИРОВАТЬ 2
Итак, я сделал этоизменения:
ajax_test.php
...
success: function(output1, output2, output3){
console.log(output1);
console.log(output2);
console.log(output2);
}
...
ajax_test2.php
...
function test2($new_a,$new_b,$new_c){
echo (json_encode($new_a));
echo (json_encode($new_b));
echo (json_encode($new_c));
}
...
теперь мои console.log спо моему success возвращает следующее:
[9,8,7] [6,5,4] [3,2,1]
success
успех
Это несколько лучше. Как отметил пользователь @David в комментариях, для меня может быть более выгодно структурировать мои исходные данные в формате json. Прежде чем я попытаюсь это сделать, есть ли способ поработать с моей текущей структурой и разделить выходные данные?