I need a way to store x y height and width in 4 jquery variables I was thinkink about the jquery ajax get but don't know how to achive this.

This is my code

<?php $result = $pdo->query('SELECT *  FROM figures');

    foreach ($result as $row=>$value)
  echo '<li>'."My value is" .$value['x'].'</li>';

  echo '<li>'."My value is" .$value['y'].'</li>';

  echo '<li>'."My value is" .$value['height'].'</li>';

  echo '<li>'."My value is" .$value['width'].'</li>';

  echo "</br>";

  } ?>

Any advice or help is apreciated thank you

Member Avatar


OK, I'm assuming you want to get data from php via js/ajax request and then use it.

There are a few ways you can do it. If the data output needs have associated html with it, you can use php OR js to build up the html before 'injecting' it into a html container.

So, as you've done...

var request = $.ajax({url: "myphpfile.php", dataType: "html"});
request.done(function( data ) {
    $('#somecontainer').html( data );

Or you can get the raw data as a json object...

$.getJSON("myphpfile.php", function(data){
    var x = data.x;
    var y = data.y;
    var width = data.width;
    var height = data.height;
    //do what you want with them

This requires a json object from the php file, like this maybe...

echo json_encode(array("x"=>$x,"y"=>$y,"width"=>$width,"height"=>$height));

But as I said there are many ways to do this. The .getJSON is a shortcut method of .ajax There are others which may be more suitable for you.

//EDIT - I just realised the multiple records (foreach)

That shouldn't complicate the JSON too much, just build up the array into a multidimensional one in the foreach loop and then echo the json_encoded array.

Ok this is what I was looking for here Thanks
But I am now wondering how to make this work with a canvas like this


I need to find a away to make ctx.fillRect to accept an array and draw multiple figures.

In my task list someone suggested to use csv functionality.

Oh and sorry if I don't strated another topic but I considered that would be confussing for others who would have the same problems as me to switch form php to jquery and find the answers.

If I made an incorrect judgement please notify me to start a new topic Thank you again for your help

Member Avatar


No, I suppose this is all related. You can do this with just php though can't you? I don't see the need for Ajax, unless you're updating the canvas somewhere.

CSV is just an alternative storage method to a DB. You could equally use a json file, XML or a file holding a php array. It doesn't really matter IMO.

They said that they want me to create multiple figures in this case rectabgles that are displayed in the canvas so I am trying to understand how can i make this.
They suggested to use csv to add this functionality.
Something like this rectangle1(120,13,40,40),rectangle2(120,40,30.80),n rectangle
And then make those coordintaes editable and delete figures This part I know pure php But how can I add a button in the canvas for edit and delete for every figure?

This is a project to test my skills they said

Thank you again for your help

Member Avatar


CSV would seem to lend itself to this.

You can populate the canvas at pageload (no need for ajax) or in response to button click - again no real need for ajax if the data is static.

Insert php variable(s) directly into js. Convert CSV data to JSON data [ json_encode() ] and then...

var rectData = <?php echo $rectData;?>; 

That will give you an object that you can loop over to produce all your rectangles.

Thank you for your advice and time this thread is solved