在线报价单 - Wordpress答案

【问题标题】：Online Quote form - Wordpress在线报价单 - Wordpress
【发布时间】：2013-04-08 02:47:10
【问题描述】：

我正在尝试为网站创建一个带有 javascript 计算的在线表单。

我的第一步是在 excel 中创建表单/表格。然后我使用在线服务将表格转换为 html。我现在有了生成的 html 代码，这很棒，但我看到这些字段不是表单中的“可编辑”字段。我尝试在转换之前删除电子表格中的“样本”数据，但这些字段仍然不可编辑？

任何建议将不胜感激。谢谢

<style type="text/css">
    table.tableizer-table {
    border: 1px solid #CCC; font-family: <?php echo $tableFont ?>;
    font-size: 12px;
} 
.tableizer-table td {
    padding: 4px;
    margin: 3px;
    border: 1px solid #ccc;
}
.tableizer-table th {
    background-color: #104E8B; 
    color: #FFF;
    font-weight: bold;
}
</style><table class="tableizer-table">
<tr class="tableizer-firstrow"><th>Date</th><th>Amount of Delegates ½ Day Conference @ R 240 pp</th><th>Amount of Delegates Full Day Conference @ R 260 pp</th><th>Menu No</th><th>Price pp for Menu       (1-7: R70, 8-10 R85, 11: R105, 12: R85)</th><th>Total persons for Meals </th><th>Amount of Single Rooms @ R 480 pp</th><th>Amount of Double Rooms @ R 720 pp</th><th>Total for the day</th></tr>
 <tr><td>4/14/2013</td><td>2</td><td>4</td><td>5</td><td>70</td><td>6</td><td>3</td><td>3</td><td>R 5,540.00</td></tr>
 <tr><td>4/15/2013</td><td>1</td><td>5</td><td>8</td><td>85</td><td>6</td><td>3</td><td>3</td><td>R 5,650.00</td></tr>
 <tr><td>4/16/2013</td><td>0</td><td>6</td><td>11</td><td>105</td><td>6</td><td>3</td><td>3</td><td>R 5,790.00</td></tr>
 <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
 <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
 <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
 <tr><td>Grand Total  for the conference</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>R 16,980.00</td></tr>
</table>

【问题讨论】：

它们在浏览器中打开时不可编辑？
@trajce - 不，没有任何字段。谢谢您的回答。我现在了解输入字段了 :) 我如何使用输入字段，但仍保持表格按列对齐？
检查下面的示例，该表包含行 <tr> 和列 <td> 内部（在本例中为 2）。 1 表示属性名称，1 表示值的输入。如果您想达到与我相同的效果，只需根据需要重复行 <tr>...</tr> 即可。请记住更改每个输入的 id，以便它们具有唯一的 ID。

标签： javascript html wordpress forms

【解决方案1】：

我不明白你所说的不可编辑是什么意思，但我猜你的意思是他们有静态数据。如果是这样，那么您需要插入<input type="text" /> 元素。

我提供了一个示例jsfiddle.net/trajce/6jAAU。
这是示例 HTML：

<table>
<tr>
    <td>
        Name:
    </td>
    <td>
        <input tyle="text" id="name"/>
    </td>
</tr>
    <tr>
    <td>
        Surname:
    </td>
    <td>
        <input tyle="text" id="surname"/>
    </td>
</tr>
</table>

【讨论】：