用数组对象填充选择选项

Question

我正在重用一个返回数组对象的函数，如下所示：

75: {id: 75, table_no: 40, capacity: 4, shape: "circle", time: null, …}

76: {id: 76, table_no: 41, capacity: 4, shape: "circle", time: null, …}

77: {id: 77, table_no: 44, capacity: 4, shape: "circle", time: null, …}

78: {id: 78, table_no: 45, capacity: 4, shape: "circle", time: null, …}

79: {id: 79, table_no: 42, capacity: 6, shape: "large_rectangle", time: null, …}

80: {id: 80, table_no: 43, capacity: 6, shape: "large_rectangle", time: null, …}

__proto__: Object

正如您在每个数组中看到的那样，有一个 id 和表编号，我想使用这些值来填充<select>输入。我已经尝试了一切，map()，for 循环，$.each(). 我什至无法显示result.length，因为它返回未定义。

这是我的代码

$.ajax({

  type: 'POST',

  url: "/modules/ajax/ajax_handler.php",

  data: data

})

.done((result) => {

  if(result) {

    result = JSON.parse(result);

    console.log(result);

    var select = $('#table');

    result.map(item => {

      console.log(item);

    })

  }

})

PHP

function getPremiseTablesByArea($connection, $id) {

  $tables = NULL;

  $query = "SELECT t.id, t.number, t.capacity, t.shape, t.time_duration, t.joinable,

                   t.area, t.baby_friendly, t.premise_code, a.name, p.name

            FROM tables t

            JOIN areas a ON a.id = t.area

            JOIN premises p ON p.code = t.premise_code WHERE t.area = ?";

  if($stmt = $connection->prepare($query)){

    $stmt->bind_param('s', $id);

    $stmt->execute();

    $stmt->bind_result($id, $number, $capacity, $shape, $time, $joinable, $area, $babyFriendly, $premiseCode, $areaName, $premiseName);

    while($stmt->fetch()){

      $tables[$id]['id'] = $id;

      $tables[$id]['table_no'] = $number;

      $tables[$id]['capacity'] = $capacity;

      $tables[$id]['shape'] = $shape;

      $tables[$id]['time'] = $time;

      $tables[$id]['joinable'] = $joinable;

      $tables[$id]['area'] = $area;

      $tables[$id]['baby_friendly'] = $babyFriendly;

      $tables[$id]['premise_code'] = $premiseCode;

      $tables[$id]['area_name'] = $areaName;

      $tables[$id]['premise_name'] = $premiseName;

    }

    $stmt->close();

  }

  return $tables;

}

Answer 1

你可以使用object.values()和forEachselect=document.getElementById("select")&nbsp; &nbsp;&nbsp;obj={0:{id: 75, table_no: 40, capacity: 4, shape: "circle", time: null}, 1:{id: 76, table_no: 41, capacity: 4, shape: "circle", time: null}, 2:{id: 77, table_no: 44, capacity: 4, shape: "circle", time: null}, 3:{id: 78, table_no: 45, capacity: 4, shape: "circle", time: null}, 4:{id: 79, table_no: 42, capacity: 6, shape: "large_rectangle", time: null}, 5:{id: 80, table_no: 43, capacity: 6, shape: "large_rectangle", time: null,}}&nbsp; Object.values(obj).forEach(o=>{&nbsp; var option = document.createElement("option")&nbsp; option.text= o.table_no&nbsp; option.value = o.id&nbsp; select.appendChild(option)})<select id="select">&nbsp;&nbsp;</select>

Answer 2

您可以更改 PHP 以返回一个对象数组：while($stmt->fetch()){&nbsp; $tables[$id]['id'] = $id;&nbsp; $tables[$id]['table_no'] = $number;&nbsp; $tables[$id]['capacity'] = $capacity;&nbsp; $tables[$id]['shape'] = $shape;&nbsp; $tables[$id]['time'] = $time;&nbsp; $tables[$id]['joinable'] = $joinable;&nbsp; $tables[$id]['area'] = $area;&nbsp; $tables[$id]['baby_friendly'] = $babyFriendly;&nbsp; $tables[$id]['premise_code'] = $premiseCode;&nbsp; $tables[$id]['area_name'] = $areaName;&nbsp; $tables[$id]['premise_name'] = $premiseName;}成为$tables = $stmt->fetchAll(PDO::FETCH_ASSOC);（但是，您的字段名称会略有不同，如果它们需要相同，请使用 AS 为查询中的字段名称添加别名）。现在您可以在生成的 javascript 数组上自由使用 map 了。