Good evening, please tell me how in js (using jQuery) through ajax to transfer the data of the array structure from the php file in json format and put this data into a table?

In the condition with loadTasks, all the data from php should be unloaded, there will be more sorting, but for now I would like to understand how easy it is to get the data some example?

index.html

<div class="container"> <div class="table-responsive"> <table class="table"> <thead> <tr> <th>Name:</th> <th>Type:</th> <th>Date:</th> <th>Status:</th> </tr> </thead> <tbody> </tbody> </table> </div> </div>

func.php

 <?php $tasks = [ [ 'id' => '4', 'name' => 'Task 4', 'type' => 'frontend', 'date' => '1512403290', 'status' => '0', ], [ 'id' => '5', 'name' => 'Task 5', 'type' => 'frontend', 'date' => '1512403320', 'status' => '0', ], [ 'id' => '6', 'name' => 'Task 6', 'type' => 'backend', 'date' => '1512403350', 'status' => '1', ], [ 'id' => '2', 'name' => 'Task 2', 'type' => 'frontend', 'date' => '1512403200', 'status' => '0', ], [ 'id' => '3', 'name' => 'Task 3', 'type' => 'frontend', 'date' => '1512403230', 'status' => '0', ], [ 'id' => '1', 'name' => 'Task 1', 'type' => 'backend', 'date' => '1512403260', 'status' => '1', ], ]; switch($_REQUEST['function']) { case 'loadTasks': $result = []; if($_REQUEST['type'] == '' || $_REQUEST['type'] == 'all'){ echo json_encode($tasks); die(); } foreach($tasks as $task){ if($task['type'] == $_REQUEST['type']){ $result[] = $task; } } echo json_encode($result); break; case 'deleteTask': if(empty($_REQUEST['id'])){ echo 0; die(); } // code delete task echo 1; break; case 'editTask': if(empty($_REQUEST['id']) || empty($_REQUEST['type']) || empty($_REQUEST['name'])){ echo 0; die(); } // code edit task echo 1; break; }?>

    3 answers 3

    So, php you display json-string. You access it and take on the js side with jquery:

     $.ajax({ type: 'POST', url: 'func.php', dataType: 'json', success: function(res) { // Дальше делай с res-ом, что хочешь. Это будет как раз твоим массивом, который ты выводил в php }, });
    • Understood in the url: link to the php file that is located on the local server and I now get the error Failed to load test / fnc.php : No 'Access-Control-Allow-Origin' header is Origin 'null' is therefore not allowed access. - Alexey Alpatov
    • Try setting "Access-Control-Allow-Credentials: true" in the .htaccess file - DakEnviy
    • prescribed it at the very top of the file, but did not help - Alexey Alpatov

    In the file where the function is called at the very beginning, write this code:

     header('Access-Control-Allow-Origin: *');
    • This error disappeared, but now writes: ReferenceError: header is not defined - Alexey Alpatov
    • Do you make a request from http to http? or from http to https? - Bykuznec
    • Here it is necessary before echo to let the client know what type of data it will take in the response - in your case it should be a call header ('application / json'); and even better to do it at the very beginning of the file whenever possible. Yes, and it should be in a PHP file, and not in JavaScript. - Daniel Protopopov

    Protocols must match) and also try updating your jquery to the latest version

    • So, as a local server, I use openserver where this func.php is located. In js file to get json in url I write url: ' test / fnc.php ' at the top of the file of this js file I add what you wrote to me above, a protocol like http but didn’t find the exact info in the openserver settings, I updated jquery. I understand that the campaign is very stupid now, for which I apologize in advance) - Alexey Alpatov