从 pdo 查询创建多行 json 并将其从 php 传递到 jquery function

Question

I am creating an Inline Edit data by using X-editable with PHP Dropdown Select Box. I am facing an issue in that I am not able to create a dynamic select option in jquery from database data.

Actually, I want to echo the source format of text in PHP so I can add in jquery. The snippet below is in the correct format, but I don't know how to echo that text dynamically using data from PHP.

-- PHP -- 
$stmt = $connect->prepare("SELECT * FROM `profile`");
$stmt->execute();  

-- JQUERY --
$('#employee_data').editable({
  container: 'body',
  selector: 'td.gender',
  title: 'Gender',      dataType: 'json',
  source: [{value: "Male", text: "Male"}, {value: "Female", text: "Female"}]
 });

Please help me to create this json structure [{value: "Male", text: "Male"}, {value: "Female", text: "Female"}] from a server-side query and pass it into the editable() function's argument in jquery.

I tried this, but it didn't work:

$result = $stmt->fetchAll();     

foreach($result as $data => $value) {         
  $data = array('value' => $value["category_id"], 'text' => $value["category"]);     
}     

$category_list = json_encode($data);

Answer 1

There is a simple logic error here - you are overwriting the value of $data every time your loop runs, so you'll only ever end up encoding the value of whatever the last entry in your data was.

Instead you need to declare an array, and then add items to that array each time you loop:

$result = $stmt->fetchAll();     
$list = array();

foreach($result as $data => $value) {         
  $list[] = array('value' => $value["category_id"], 'text' => $value["category"]);     
}     

$category_list = json_encode($list);

And then in the JavaScript, simply write:

source: <?php echo $category_list; ?>

Answer 2

There are several points to inform you of...

1. If you are not using any placeholders in your sql, then using a prepared statement is needless overhead. Just use query() .

2. Do not ask for more data from your SELECT clause than you actually intend to use. I don't know how many columns are in your table, but you only need to be fetching category_id and category according to your posted script.

3. By aliasing your column names in your SELECT clause, you can avoid the extra step of iterating the result set's rows just to adjust the keys.

4. There seems to be a disconnect in your post between category_id & category versus gender & gender . I don't know exactly what data is being used to create these <option> s, but I would like to tell you that there is never any benefit to repeating identical text in the option's text and the same option's value attribute. In other words, <option value="Male">Male</option> should only ever be written as <option>Male</option> ; the former is simply redundant markup bloat. I will assume that category_id and category are not identical values, so there should be no concern for redundancy.

5. fetchAll() is most appropriately used when you are not iterating the data in the same "layer". Because the server-side (php) data is being passed to the client-side (js), there is no need to manually iterate the result set to create an array; just let fetchAll() do all of the work.

Code: (assuming you are querying in the same file that you are printing to screen)

source = <?php echo json_encode($pdo->query("SELECT `category_id` AS `value`, `category` AS `text` FROM `profile`")->fetchAll()); ?>

There is a bounty of good advice/techniques @ https://phpdelusions.net/pdo_examples/select