datatable JSF 2.0 中的日历
我有一个包含记录列表的数据表,我的要求是包含其中一列的日历。我已经为日历编写了一个Javascript,单击日历图像即可获取日期并放置在相应的位置输入字段。现在我面临的问题是我放置的日历仅显示数据表的第一行。我的日历是根据“id”属性获取的,如何获取每行的 ID 。 下面是我尝试过的代码
<h:dataTable id="d" value="#{Class.bean.itemList}" var="iBean" >
<h:column>
<div class="demo">
<f:facet name="header">
<h:outputText style=""value="Date" />
</f:facet>
<h:inputText id="dDate" value="#{iBean.date}" />
<input style="display:none" type="text" id="datepicker" onchange="fetchDate(this);hiddenButtonClick(this)" >
<h:commandButton style="display:none" id="hiddenitemDateCalc" value="get date" action="#{Class.itemDateFromUI}" >
</h:commandButton>
</div>
</h:column>
</h:dataTable>
I have data table which has a list of records, my requirement is to include a calendar for one of the column in it.I have written a Javascript for a calendar, which on click on calendar image fetches the date and is placed in the corresponding input field.Now the problem i'm facing is the calendar which I've placed in displayed only for the first row of the datatable.my calendar is fetched based on the "id" attribute, how can i get the ID for each row.
below is the code which I tried
<h:dataTable id="d" value="#{Class.bean.itemList}" var="iBean" >
<h:column>
<div class="demo">
<f:facet name="header">
<h:outputText style=""value="Date" />
</f:facet>
<h:inputText id="dDate" value="#{iBean.date}" />
<input style="display:none" type="text" id="datepicker" onchange="fetchDate(this);hiddenButtonClick(this)" >
<h:commandButton style="display:none" id="hiddenitemDateCalc" value="get date" action="#{Class.itemDateFromUI}" >
</h:commandButton>
</div>
</h:column>
</h:dataTable>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您的示例最终会出现无效的 HTML。所有输入字段都具有相同的 ID。您需要使用
而不是,这样 JSF 将为每一行生成唯一的 ID。
或者,更简单的是,获取一个附带可重用日历组件(等等)的组件库。
与具体问题无关,
实际上应该在。
Your example ends up in invalid HTML. All input fields get the same ID. You need to use
<h:inputText>
instead of<input>
, this way JSF will generate an unique ID for each row.Or, easier, grab a component library which ships with a reuseable calendar component (and more).
<t:inputCalendar>
<rich:calendar>
<p:calendar>
Unrelated to the concrete problem, that
<f:facet>
should actually be declared outside the<div>
.