javascript 如何:HTML 表格行点击结果在 POST 表单中链接到后续页面

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17254105/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 07:39:12  来源:igfitidea点击:

How: HTML table row click results in POST form linking to subsequent page

phpjavascriptjqueryhtmlcss

提问by user2014175

Evening all, I have the form, which is populated from a sql database.

晚上,我有一个表格,它是从一个 sql 数据库中填充的。

    <table class="sortable"  border="2" cellspacing="2" cellpadding="2">
    <tr>
        <th> Serial Number </th>
        <th> Date </th>
        <th> Time </th>
        <th> Color </th>
        <th> Design </th>
        <th> Result </th>
    </tr>

<?php
    $i = 0;
    while ($i < $num)
    {
        $serial = mysql_result($results, $i, 'serial_number');
        $date = mysql_result($results, $i, 'date');
        $time = mysql_result($results, $i, 'time');
        $airport = mysql_result($results, $i, 'color');
        $terminal = mysql_result($results, $i, 'design');
        $result = mysql_result($results, $i, 'result');

?>

    <tr>
        <td> <?php echo $serial; ?> </a></td>
        <td> <?php echo $date; ?> </td>
        <td> <?php echo $time; ?> </td>
        <td> <?php echo $color; ?> </td>
        <td> <?php echo $design; ?> </td>
        <td> <?php echo $result; ?> </td>
    </tr>

<?php
    $i++;
    }

?>

What I would like to do is have each row of the table clickable. When each row is clicked, one cell of data from that row (the first cell) is sent via (POST) to the next page. Can a form be integrated into each tr??

我想做的是让表格的每一行都可以点击。单击每一行时,该行中的一个数据单元格(第一个单元格)通过 (POST) 发送到下一页。一个表单可以集成到每个tr中吗??

回答by Jivings

You specify jQuery in your tags, so I assume you can use that.

您在标签中指定了 jQuery,所以我假设您可以使用它。

// when any row is clicked
$('table').on('click', 'tr', function () {
  // get the value
  var value = $(this).find('td:first').text();
  // redirect the user with the value as a GET variable
  window.location = nextPage + '?data=' + value;
});

Where nextPageis the URL of the page you want to redirect to.

nextPage您要重定向到的页面的 URL在哪里。

回答by boisvert

The short answer: yes, a form can be integrated into each tr.

简短的回答:是的,一个表单可以集成到每个 tr 中。

The long answer - use just as you did before:

长答案 - 像以前一样使用:

<tr>
    <td> 
      <form method="post" target="details.php">
          <input type="submit" name="more" value="<?php echo $serial; ?>"
      </form>
      <?php echo $serial; ?>
    </td>
    <td> <?php echo $date; ?> </td>
    <td> <?php echo $time; ?> </td>
    <td> <?php echo $color; ?> </td>
    <td> <?php echo $design; ?> </td>
    <td> <?php echo $result; ?> </td>
</tr>

But GET is easier, make a series of links that go details.php?number=123, or whichever:

但是 GET 更容易,制作一系列链接到 details.php?number=123,或以任何一个:

    <td> 
      <a href="details.php?number=<?php echo $serial; ?>"
      <?php echo $serial; ?>
      </a>
    </td>

Although get can use a form, the data send is not user-customised, so the form data can be generated to use like a link.

尽管 get 可以使用表单,但发送的数据不是用户自定义的,因此可以生成表单数据以用作链接。

回答by rpasianotto

Try with that code in echo when create your table:

创建表时,在 echo 中尝试使用该代码:

<td><?php echo('<a href="my_page.php?action&serial='.$serial.'">'.$serial.'</a>');?></td>

For each data that you have!

对于您拥有的每个数据!

OTHER SOLUTION WITHOUT ACTION

不采取行动的其他解决方案

<td><?php echo('<a href="my_page.php?serial='.$serial.'">'.$serial.'</a>');?></td>

my_page.php- where to send the data

my_page.php-将数据发送到哪里

?[variable_name]- where is stored the data

?[variable_name]-数据存储在哪里