【问题标题】:PHP issue with checkbox value [closed]复选框值的PHP问题[关闭]
【发布时间】:2014-11-11 14:44:15
【问题描述】:

我有这个 PHP 代码:

function makeTable($data){
    $ordered = array_map(function($day) {
        return array_keys($day);
    }, $data);

    $headers = array_map(function($a) {
        return "<th>$a</th>";
    }, array_keys($ordered));

    $max_indice = max( array_map(function($day) {
        return count($day) - 1;
    }, $ordered) );


    $rows = array_map(function($i) use ($ordered) {
        return '<tr>' . join( array_map(function($day) use ($i) {
            return '<td><input type="checkbox" name="datetime" id="datetime" value="' . $i . '" />' . $day[$i] . '</td>';
        }, $ordered)) . '</tr>';
    }, range(0, $max_indice));
    echo "<table border='1'>".join($headers)."<tbody>".join($rows)."</tbody></table>";
}

makeTable($datesAvailableArray);

这个函数做了什么,它需要我的$datesAvailableArray数组:

Array
(
    [Saturday] => Array
    (
        [11:00am] => 0
        [12:00pm] => 0
        [1:00pm] => 0
        [2:00pm] => 0
        [3:00pm] => 0
        [4:00pm] => 0
        [5:00pm] => 0
    )

    [Sunday] => Array
    (
        [11:00am] => 0
        [12:00pm] => 0
        [1:00pm] => 0
        [2:00pm] => 0
        [3:00pm] => 0
        [4:00pm] => 0
        [5:00pm] => 0
    )

    [Monday] => Array
    (
        [11:00am] => 0
        [12:00pm] => 0
        [1:00pm] => 0
        [2:00pm] => 0
        [3:00pm] => 0
        [4:00pm] => 0
        [5:00pm] => 0
    )

    [Tuesday] => Array
    (
        [11:00am] => 0
        [12:00pm] => 0
        [1:00pm] => 0
        [2:00pm] => 0
        [3:00pm] => 0
        [4:00pm] => 0
        [5:00pm] => 0
    )

    [Wednesday] => Array
    (
        [11:00am] => 0
        [12:00pm] => 0
        [1:00pm] => 0
        [2:00pm] => 0
        [3:00pm] => 0
        [4:00pm] => 0
        [5:00pm] => 0
    )

    [Thursday] => Array
    (
        [11:00am] => 0
        [12:00pm] => 0
        [1:00pm] => 0
        [2:00pm] => 0
        [3:00pm] => 0
        [4:00pm] => 0
        [5:00pm] => 0
    )

    [Friday] => Array
    (
        [11:00am] => 0
        [12:00pm] => 0
        [1:00pm] => 0
        [2:00pm] => 0
        [3:00pm] => 0
        [4:00pm] => 0
        [5:00pm] => 0
    )
)

并制作这个 html 表格:

<table border="1">
    <tbody>
        <tr>
            <th>
                Saturday November 15th
            </th>
            <th>
                Sunday November 16th
            </th>
            <th>
                Monday November 17th
            </th>
            <th>
                Tuesday November 18th
            </th>
            <th>
                Wednesday November 19th
            </th>
            <th>
                Thursday November 20th
            </th>
            <th>
                Friday November 21st
            </th>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="0">
                11:00am
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="0">
                11:00am
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="0">
                11:00am
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="0">
                11:00am
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="0">
                11:00am
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="0">
                11:00am
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="0">
                11:00am
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="1">
                12:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="1">
                12:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="1">
                12:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="1">
                12:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="1">
                12:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="1">
                12:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="1">
                12:00pm
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="2">
                1:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="2">
                1:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="2">
                1:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="2">
                1:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="2">
                1:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="2">
                1:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="2">
                1:00pm
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="3">
                2:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="3">
                2:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="3">
                2:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="3">
                2:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="3">
                2:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="3">
                2:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="3">
                2:00pm
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="4">
                3:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="4">
                3:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="4">
                3:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="4">
                3:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="4">
                3:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="4">
                3:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="4">
                3:00pm
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="5">
                4:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="5">
                4:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="5">
                4:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="5">
                4:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="5">
                4:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="5">
                4:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="5">
                4:00pm
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="6">
                5:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="6">
                5:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="6">
                5:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="6">
                5:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="6">
                5:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="6">
                5:00pm
            </td>
            <td>
                <input type="checkbox" name="datetime" id="datetime" value="6">
                5:00pm
            </td>
        </tr>
    </tbody>
</table>

我想要做的是将标题日期作为复选框值。这段代码可以吗?

【问题讨论】:

  • 您能重新表述一下您的问题吗?目前尚不清楚问题是什么。也就是说,您是否只是尝试这样做并看看会发生什么?
  • 错误。将value="0" 替换为value="the data you want"。 (请更好地利用空格来格式化您的代码)
  • 你有 2 个&lt;tbody&gt; 部分我相信你打算有一个&lt;thead&gt; 然后是一个&lt;tbody&gt;
  • 如果我将我的复选框值更改为 $day[$i],我将有时间将日期添加到复选框...这有意义吗?
  • id 会有所不同,因为每个项目的日期和时间都不同。

标签: php html


【解决方案1】:

首先,您需要更改您的$datesAvailableArray,使其包含实际日期。 ISO 8601 字符串是一种很好的格式。

$datesAvailableArray = array(
    'Saturday' => array(
        '2014-11-14T11:00:00Z',
        '2014-11-14T12:00:00Z',
        '2014-11-14T13:00:00Z',
        '2014-11-14T14:00:00Z'
    ),
    'Sunday' => array(
        '2014-11-15T11:00:00Z',
        '2014-11-15T12:00:00Z',
        '2014-11-15T13:00:00Z',
        '2014-11-15T14:00:00Z'
    )
);

现在我们有了日期字符串,我们可以创建用于格式化日期的 DateTime 对象:

$saturday_1100 = DateTimeImmutable::createFromFormat(DateTime::ISO8601, '2014-11-14T11:00:00Z');
$saturday_1100->format('g:ia'); // 11:00am

在我们的例子中,我们使用DateTimeImmutable class,因为我们不想在创建日期后更改它们。

所以让我们更改我们的makeTable 函数以使用我们的新朋友DateTimeImmutable

function makeTable($data) {

    $headers = array_map(function($a) {
        return "<th>$a</th>";
    }, array_keys($data));

    $max_indice = max( array_map(function($day) {
        return count($day) - 1;
    }, $data) );

    // Create a new array where we group by hour
    $rows = array_map(function($i) use ($data) {
        // create each hour
        return '<tr>' . join( array_map(function($day) use ($i){
            $ts = isset($day[$i]) ? DateTimeImmutable::createFromFormat(DateTime::ISO8601, $day[$i]) : null;
            if ($ts){
                $label = '<label for="datetime">'.$ts->format('g:ia').'</label>';
                $input = vsprintf ( 
                    '<input type="checkbox" name="datetime" id="%s" value="%s" />',
                    array(
                        'datetime_'. $ts->getTimestamp(), // ID
                        $ts->format('c')  // Value
                    )
                );
                return '<td>' . $label . $input . '<td>';
            } else {
                return '<td></td>';
            }
        }, $data)) . '</tr>';
    }, range(0, $max_indice));

    // Don´t get rid of the thead element. 
    // It tells the browser that your table is a real table containing data and not just a crappy layout.
    return "
    <table>
        <caption>My Table</caption>
        <thead>".join($headers,'\n')."</thead>
        <tbody>".join($rows, '\n')."</tbody>
    </table>";
}

echo makeTable( $datesAvailableArray ); 会给我们这样的东西:

<table>
  <caption>
    My Table
  </caption>

  <thead>
    <tr>
      <th>Saturday</th>
      <th>Sunday</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td><label for="datetime">11:00am</label><input type="checkbox" name="datetime" id="datetime_1415962800" value="2014-11-14T11:00:00+00:00" /></td>
      <td><label for="datetime">11:00am</label><input type="checkbox" name="datetime" id="datetime_1416049200" value="2014-11-15T11:00:00+00:00" /></td>
    </tr>
    <tr>
      <td><label for="datetime">12:00pm</label><input type="checkbox" name="datetime" id="datetime_1415966400" value="2014-11-14T12:00:00+00:00" /></td>
      <td><label for="datetime">12:00pm</label><input type="checkbox" name="datetime" id="datetime_1416052800" value="2014-11-15T12:00:00+00:00" /></td>
    </tr>
    <!-- MORE ... -->
  </tbody>
</table>

总结:

我们有唯一的输入 id 值。我们在发布此表单时发送的值是 ISO-8601 日期字符串。 我们还将小时文本包装在 &lt;label&gt; 标记中,并带有一个有助于可访问性的 for 属性。

【讨论】:

    猜你喜欢
    • 2017-02-26
    • 2011-03-15
    • 1970-01-01
    • 2013-11-05
    • 2014-05-03
    • 2012-10-16
    • 2020-08-12
    • 1970-01-01
    相关资源
    最近更新 更多