动态创建表格

在我的页面上，我显示了一个条目表。在表格末尾是一个“修改”按钮。当点击按钮时，该行变成用于直接修改内容的表单。动态创建表格

此代码：被创建这样

element.innerHTML = "<tr class='alt_col'>"; 
element.innerHTML += "<form action='/RIDT/includes/modify_codeplug.inc.php' method='POST' name='modify_form'>"; 
element.innerHTML += "<td><input type='text' name='fileName' value='" + fileName + "'></td>"; 
element.innerHTML += "<td><input type='text' name='location' value='" + loc + "'></td>"; 
element.innerHTML += "<td><input type='text' name='build' value='" + build + "'></td>"; 
element.innerHTML += "<td><input type='text' name='version' value='" + version + "'></td>"; 
element.innerHTML += "<td><select name='type' id ='selectType'>" + descOptions + "</select></td>"; 
element.innerHTML += "<td><input type='hidden' name='id' value='" + id + "'/><input type='submit' value='Submit'/></td>"; 
element.innerHTML += "</form>"; 
element.innerHTML += "</tr>"; 

var options = document.getElementById("selectType").options; 

for (i = 0; i < options.length; i++) 
{ 
    if (options[i].text == desc) 
    { 
     options[i].selected=true; 
    } 
}

结果形式：

<form action="/RIDT/includes/modify_codeplug.inc.php" method="POST" name="modify_form"></form>

与所有的封闭元件来后的形式的输入元件。为什么表单被提前关闭？

来源

2015-11-06 HFTekk

因为无法将表格数据元素包装在表格中。这是无效的HTML，并且浏览器试图纠正它。 – j08691

但我已经在另一页上完成了，它确实有效。现在两页上的代码看起来完全相同，但问题仍然存在。 – HFTekk

我会回来的。另一个页面显示一个“添加新的”表格作为表格行显示。所以没有细胞数据存在。 – HFTekk

-1

我没有测试这个，但如果你尝试在DOM中插入一个未关闭的元素，jQuery也会遇到同样的问题。结束标签为您添加。

试试这个：

//track the html as a single string var 
var html = "<tr class='alt_col'>"; 
html += "<form action='/RIDT/includes/modify_codeplug.inc.php' method='POST' name='modify_form'>"; 
html += "<td><input type='text' name='fileName' value='" + fileName + "'></td>"; 
html += "<td><input type='text' name='location' value='" + loc + "'></td>"; 
html += "<td><input type='text' name='build' value='" + build + "'></td>"; 
html += "<td><input type='text' name='version' value='" + version + "'></td>"; 
html += "<td><select name='type' id ='selectType'>" + descOptions + "</select></td>"; 
html += "<td><input type='hidden' name='id' value='" + id + "'/><input type='submit' value='Submit'/></td>"; 
html += "</form>"; 
html += "</tr>"; 

// set the html string once 
element.innerHTML = html;

来源

2015-11-06 16:27:56 ps2goat

感谢大家的帮助。我将在以后更深入地研究所有提供的建议。为了节省时间，我做了一个不同的方式。提交按钮不是提交表单，而是调用另一个JavaScript函数，它从DOM中挑选输入数据，然后构建隐藏表单并将其提交给我的php脚本。这不太好，但它完成了工作。

来源

2015-11-06 17:53:01 HFTekk

动态创建表格

回答

相关问题