`
Anddy
  • 浏览: 198028 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

在jsf 中使用js 获取jsf中input控件的的value值

阅读更多

因为在jsf中使用控件标签 和html中使用的略有不同,所以在jsf用使用js不是很方便!

 

但是jsf网页代码在客服端显示出来的代码还是纯html ,jsp ,js代码。(在客服端浏览器右键“查看源代码”即可)

 <webuijsf:textField
onChange="validateEmail();" 
binding="#{UserRegisteration.textField2_Email}" 
id="textField2_Email" 
required="false" 
style=" position: relative z-index: 501"/>
                                    

 最终的js获取email的值的代码;

function validateEmail(){
    var text = document.forms['form1'].elements[1].value;
    alert(text);
}
 

本想通过js获取jsf中textfield 控件的value值,再查询数据库,用来验证用户名是否可用。

一开始觉得有点不可能。因为jsf中textfield控件的值是通过textfield的text属性来设定的。而js中是通过value来获取的。有点失望。

 

后来在刘成同学的引导下,通过浏览器看到了网页的源代码:1.只有一个form 对象。名为“form1”

2.第一个input 的id为form1:textField2_Email(说明下,这个 textField2_Email 是jsf中输入email的一个textfield控件的id);但是在js中通过如下可以得到DOM对象;

var inputEmail = document.getElementById(form1:textField2_Email);
alert(inputEmail);
alert(inputEmail.vaue);

 分别 输出如下:[object HTMLElement] ;undefined

 

本来想通过这段代码得到id 为textField2_Email的对象及其value;

不知道这个object指的是什么。。郁闷很长一段时间;

 

 var text = document.forms['form1'].elements[0];
   alert(text);

 发现客服端只有一个form1 ;所以想到用上面的这段代码试了下,输出如下:

[object HTMLInputElement]

看到一点希望,至少得到了input对象了。

var text = document.forms['form1'].elements[0].value;
alert(text);

 这样就输出你刚才输入的值,到此,在jsf中通过js得到jsf中控件的text属性值的目的达到

 

分享到:
评论

相关推荐

    JSF控件详细说明

    在这些阶段中,JSF控件的值被初始化、验证、更新,并最终显示给用户。 ### JSF组件库 除了标准JSF组件外,还有许多第三方库提供了更丰富的控件,如PrimeFaces、RichFaces和IceFaces。这些库提供了许多高级组件,如...

    JSF日历控件

    在JSF中,开发者可以使用各种预定义的UI组件,包括日历控件,来简化前端用户界面的开发。这个控件允许用户选择日期,通常在需要输入日期的表单中非常有用。 **1. JSF日历组件的引入** JSF的日历组件通常由一个特定...

    jsf动态创建表单控件实例.

    在JSF中,动态创建表单控件是一项强大的功能,它允许开发者在运行时根据需求生成不同的用户输入元素,提高了代码的灵活性和可扩展性。下面我们将详细探讨JSF动态创建表单控件的概念、实现方法以及相关的实例。 1. *...

    jsf 控件说明(很好)

    JavaServer Faces(JSF)...在JSF开发中,理解这些核心概念和组件对于构建功能丰富的Web应用至关重要。通过利用JSF提供的控件和标记库,开发者可以更高效地构建交互式、动态的用户界面,同时享受到Java的强大后端支持。

    学习技术 jsf必备 ————JSF标签.pdf

    ### 学习技术 JSF必备 —— JSF标签详解 #### 1. JSF标签概述 JavaServer Faces (JSF) 是一种用于构建基于组件的用户界面的Java Web框架。它提供了一组丰富的标签库,使得开发人员能够更加高效地创建动态网页应用...

    JSF标签简体中文版

    - **表头、表尾**:可以在表格中加入表头和表尾行。 - **TableModel类**:用于管理表格的数据模型,提供了更高级的表格功能。 #### 九、JSF标签与HTML4.01属性兼容 - 除了JSF特有的属性外,还可以使用HTML4.01中...

    JSF学习笔记 jsF

    此外,JSF还支持EL(Expression Language)用于在页面中绑定和操作数据,以及JSF的生命周期,包括恢复视图、应用请求值、处理验证、更新模型值和调用应用的后处理动作等阶段。JSF还有强大的国际化支持和错误处理机制...

    jsf2.0上传组件(servlet3.0)

    在本文中,我们将深入探讨如何使用JavaServer Faces (JSF) 2.0与Servlet 3.0结合实现文件上传功能。JSF是Java平台上的一种Web应用程序开发框架,而Servlet 3.0则是用于处理HTTP请求的核心Java API,两者结合可以提供...

    用jsf页面动态创建表格

    本文介绍了如何在JSF页面中使用JavaScript动态创建表格,并提供了详细的示例代码。通过这种方式,可以根据用户的操作实时更新表格内容,极大地提高了Web应用的灵活性和可用性。此外,还讨论了如何添加更复杂的表单...

    jsp中各种日期控件

    在JSP(Java Server Pages)开发中,日期控件是一种常用的功能组件,它允许用户在网页上选择或输入日期,增强了用户体验并简化了数据处理。本文将深入探讨JSP中的几种常见日期控件,帮助你更好地理解和应用这些控件...

    JSF标签全解

    - **功能**:`f:converter` 标签允许我们指定一个JSF Converter实现(实现了`javax.faces.convert.Converter`接口的类),以便对JSF组件的输入输出值进行转换。 - **使用示例**: - JSP: ```jsp &lt;h:inputText ...

    jsf实现基于ajax的上传例子

    3. **配置Servlet映射**:在 `web.xml` 中配置用于获取文件上传进度的Servlet。 ```xml &lt;servlet-name&gt;GetProgressServlet &lt;servlet-class&gt;com.example.GetProgressServlet&lt;/servlet-class&gt; ...

    各种JSF HTML标签总结.doc

    - **value**:要显示的文本值。 - **escape**:如果设置为`true`,会转义`、`&gt;`和`&`等特殊字符。默认值为`false`。 - **style**:CSS样式。 ##### 5. `&lt;h:outputFormat&gt;` 标签 `&lt;h:outputFormat&gt;` 标签用于格式化...

    JSF入门实例

    为了使用JSF,开发者需要将相应的JSF实现加入到项目的类路径中。例如,如果选择使用Sun的参考实现,则需要在Web应用的`WEB-INF/lib`目录下放置以下JAR文件: - `jsf-impl.jar`:JSF实现的核心库。 - `jsf-api.jar`...

    《JSF标签》简体中文版 pdf

    - **inputFile**:生成文件上传控件。 ##### 1.4 命令类标签 **命令类标签** 包括`commandButton`和`commandLink`等,用于触发服务器端的动作。 - **commandButton**:生成按钮,点击后提交表单。 - **...

    JSF标准标签

    在描述中提到,JSF通过集成良好的模型-视图-控制器(MVC)设计模式,确保了应用程序的高度可维护性。此外,JSF由Java Community Process (JCP)制定并发布,这确保了它是Java标准的一部分,并且可以得到各种开发工具...

    《JSF标签》简体中文版.pdf

    参数将自动附加在URL后面,格式为`name=value`。 - **outputFormat**:用于生成格式化文本,可以结合`&lt;f:param&gt;`设置参数。 - **outputText**:用于显示纯文本内容,可以包含静态文本或动态数据绑定。 #### 1.3 ...

    ADF_inputDate

    在JSF (JavaServer Faces) 视图层的XML文件(.jspx)中,可以使用以下代码创建一个基本的`InputDate`组件: ```xml &lt;af:inputDate id="id1" value="#{bindings.date.inputValue}" label="日期选择" /&gt; ``` 这里,`...

Global site tag (gtag.js) - Google Analytics