Using <input> tags directly inside <table>_问答_开发者

Using <input> tags directly inside <table>

开发者 https://www.devze.com 2022-12-17 22:55 出处：网络

I\'m generating a table with multiple editable rows. like a employee every row so that you can change multiple names at the same time. I have some hidden fields inside that also need to be looped with

相关专题：php xhtml

I'm generating a table with multiple editable rows. like a employee every row so that you can change multiple names at the same time. I have some hidden fields inside that also need to be looped with the table rows.

The problem is that having inputs inside table tags is not valid xhtml. And I don't want to wrap them inside <tr><td> tags since this would clearly make a new column for hidden fields that don't need one.

Does som开发者_JS百科eone know if I can wrap them inside something else to make it valid xhtml?

You can put the hidden <input>s in an existing cell.

They're hidden, you can place them next to any visible input and be fine.

<tr>
  <td><input type="text" name="fname" /></td>
  <td><input type="text" name="lname" />
      <input type="hidden" name="cid" value="11" />
      <input type="hidden" name="uid" value="12" />
  </td>
</tr>

What's wrong with putting the hidden input tag in the final column?

...
<td>
  <input type="text" name="yourname" />
  <input type="hidden" name="thisrowuniqueid" value="123" />
</td>
...

I am not 100% sure if this will work or validate but you could try to set the containing rows and columns to visibility hidden.

tr.hidden, td.hidden {
    visibility: hidden;
}

Worth a shot.

this is perfectly valid XHTML strict code. It is possible to add input fields in table tags

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Dicabrio.com</title> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 

</head> 
<body>
<form id="test" method="post" action="test.php">
<fieldset>
<legend>test</legend>
<table>
    <tr><td>
    <label>test</label><input type="text" name="test" value="" />
</td></tr>
</table>
</fieldset>
</form>
</body> 
</html>