cfinput中的标签显示在文本框的右侧

Question

使用Coldfusion 9和cfform使用HTML格式时,我将cfinput放在带有标签的页面上,它会在文本框的右侧显示标签.我已尝试使用标签,无论有没有,但无论我做什么,标签总是在框的右侧.

<cfform method="post" name="mfForm" >
  <label for="campaign">Mailfile ID:</label>
  <cfinput type="text" name="campaign" id="campaign">
  <cfinput type="submit" name="submit" value="Submit" id="submit">
</cfform>

最近才记得遇到这个问题.我只想使用HTML表单,但想利用cf的autosuggest.

Answer 1

我讨厌这样说,但坦率地说这就是为什么许多人建议放弃内置的ajax功能并直接使用底层库(或一些jQuery替代品).你将拥有更大的控制权,更多的选择,更不用说你不会被ColdFusion随附的任何版本所束缚.这些库中的大多数都经常更新,因此在一年内与CF捆绑的库经常过时.ExtJS就是一个很好的例子.公共版本已经达到版本4.2.1,但CF9仍然使用3.1.0.

无论如何,回到你的问题...如果你做一个视图源,你会看到CF生成几个div标签,其中一个包含style="float:left"指令,可以解释你看到的行为.

我做了一个快速搜索,并发生在CF8文档中的一个注释,其中暗示了日期字段的黑客攻击,这可能也适用于此:

• 要在Internet Explorer和Firefox中正确显示控件旁边的标签文本,必须在标签中包围标签文本, <div style="float:left;">并<br>在每行之间放置三个标签.

只需添加div似乎对我发布的样本有用:

<cfform method="post" name="mfForm" >
    <div style="float:left;">
        <label for="campaign">Mailfile ID:</label>
    </div>
    <cfinput type="text" name="campaign" id="campaign" autosuggest="AA,BBB,CCC,DDD">
    <cfinput type="submit" name="submit" value="Submit" id="submit">
</cfform>

但同样,你可能想要考虑直接使用javascript库而不是依赖于内置的ajax功能,这样你就可以避免像这样的怪异.