1. JSF与原生HTML元素的交互机制

在JSF (JavaServer Faces) 应用中，Facelets作为默认的视图技术，允许开发者使用XML语法构建用户界面。然而，初学者常犯的一个错误是将JSF的表达式语言 (EL) 直接应用于原生的HTML元素，期望它们能像JSF组件一样与后端Java Bean进行交互。

例如，在提供的代码片段中：

<input type="text" action="#{InternetBean.entity.ilink}"/>
Create

这里尝试将EL表达式#{InternetBean.entity.ilink}和#{InternetBean.create}分别绑定到原生HTML <input> 和 元素的 action 属性上。然而，原生HTML元素的 action 属性是用于指定表单提交的目标URL或按钮的客户端行为，它们并不会被JSF框架解析以触发后端Java Bean的方法或进行数据绑定。JSF的EL表达式只有在JSF组件（如、等）的特定属性上才会被JSF生命周期处理。

2. 正确使用JSF组件进行数据展示

对于数据的展示，JSF提供了强大的组件和Facelets标签。在提供的代码中，使用来遍历并展示数据是正确的实践：

    
        #{e.id}
        #{e.ilink}
        #{e.idescription}
        #{e.createdate}
    

这里，是一个Facelets标签，它能够识别并处理value属性中的EL表达式#{InternetBean.list}，从而迭代后端Bean中名为list的集合。在每次迭代中，var="e"将当前元素绑定到变量e，其属性（如e.id、e.ilink等）可以通过EL表达式在HTML表格中正确显示。这是因为本身就是JSF/Facelets生态系统的一部分，它知道如何与JSF生命周期协同工作。

3. 正确使用JSF组件处理表单输入与动作

要实现用户输入和触发后端方法，必须使用JSF提供的UI组件。

3.1 JSF表单组件：

所有需要与JSF后端Bean交互的输入组件和命令组件（按钮）都必须被包裹在标签内。是JSF表单的核心，它负责处理表单提交、数据转换、验证和更新模型值等JSF生命周期阶段。

3.2 JSF输入组件：

对于文本输入，应使用组件。它的value属性用于双向绑定后端Bean的属性。

Not Link

Açıklama

在这里，value="#{InternetBean.entity.ilink}"表示当用户在输入框中输入内容时，该值会自动更新到InternetBean对象的entity属性的ilink字段；反之，如果InternetBean.entity.ilink有值，它也会显示在输入框中。

3.3 JSF命令组件：

对于触发后端方法的按钮，应使用组件。它的action属性用于指定一个方法表达式，当按钮被点击时，JSF会调用该方法。

这里的action="#{InternetBean.create}"表示当“Create”按钮被点击时，JSF将调用InternetBean中名为create的方法。value属性则定义了按钮上显示的文本。

3.4 后端Bean的命名约定

在JSF中，后端Bean通常通过@Named注解进行管理。如果@Named注解没有指定value属性（例如@Named），那么JSF会默认将类名的首字母小写作为其在EL表达式中引用的名称。例如，如果你的类是InternetBean.java，并且注解为@Named，那么在EL中应使用#{internetBean.create}（小写i）。如果指定了value，例如@Named("MyInternetBean")，则应使用#{MyInternetBean.create}。

示例： 如果你的后端Bean类定义如下：

import javax.inject.Named;
import javax.enterprise.context.RequestScoped; // 或 @ViewScoped

@Named("InternetBean") // 明确指定名称，与EL表达式匹配
@RequestScoped // 选择合适的Scope
public class InternetBean {
    private Entity entity = new Entity(); // 假设Entity是你的数据模型
    private List list; // 假设这是用于表格展示的数据列表

    // Getter和Setter for entity
    public Entity getEntity() {
        return entity;
    }

    public void setEntity(Entity entity) {
        this.entity = entity;
    }

    // Getter for list (通常从数据库加载)
    public List getList() {
        // 示例：实际应从数据库加载
        if (list == null) {
            list = new ArrayList<>();
            list.add(new Entity(1, "link1", "desc1", new Date()));
            list.add(new Entity(2, "link2", "desc2", new Date()));
        }
        return list;
    }

    public String create() {
        // 实现创建逻辑，例如保存entity到数据库
        System.out.println("Creating: " + entity.getIlink() + " - " + entity.getIdescription());
        // 可以在这里添加数据库插入逻辑
        return null; // 返回null表示停留在当前页面
    }

    public String update() {
        // 实现更新逻辑
        System.out.println("Updating: " + entity.getIlink() + " - " + entity.getIdescription());
        return null;
    }

    public String delete() {
        // 实现删除逻辑
        System.out.println("Deleting entity with ID: " + entity.getId());
        return null;
    }

    // 假设的Entity类
    public static class Entity {
        private Integer id;
        private String ilink;
        private String idescription;
        private Date createdate;

        public Entity() {}

        public Entity(Integer id, String ilink, String idescription, Date createdate) {
            this.id = id;
            this.ilink = ilink;
            this.idescription = idescription;
            this.createdate = createdate;
        }

        // Getters and Setters for all properties
        public Integer getId() { return id; }
        public void setId(Integer id) { this.id = id; }
        public String getIlink() { return ilink; }
        public void setIlink(String ilink) { this.ilink = ilink; }
        public String getIdescription() { return idescription; }
        public void setIdescription(String idescription) { this.idescription = idescription; }
        public Date getCreatedate() { return createdate; }
        public void setCreatedate(Date createdate) { this.createdate = createdate; }
    }
}

在这种情况下，EL表达式#{InternetBean.create}是正确的。

4. 完整的修正后的XHTML代码示例

结合上述说明，以下是修正后的internetprog.xhtml代码片段，展示了如何正确地使用JSF组件：

    
        
        
        
    
    
        

            

                
 Dersler
                

                    
 İnternet Programcılığı
                    
 Siber Güvenlik
                    
 Programlama Dilleri
                
            
            

                
                 
                    
                                

                        

                            

                                
ID
                                
NOT LİNK
                                
AÇIKLAMA
                                
TARİH
   
                            
                        
                        

                            

                                    
#{e.id}
                                    
#{e.ilink}
                                    
#{e.idescription}
                                    
#{e.createdate}
                                
                            
                        
                    
                

                

                    
                    
                        Not Link
                        
                        

                        Açıklama
                        
                        


                        
                        
                        
                        
                    
                
            
        
    

5. 注意事项与总结

• JSF组件与原生HTML： 始终记住，当需要与JSF后端Bean进行数据绑定或方法调用时，必须使用JSF提供的组件（如、、等），而不是原生HTML元素。原生HTML元素不会触发JSF生命周期。
• 的重要性： 所有需要提交数据或触发后端方法的JSF组件都必须包含在标签内。
• EL表达式： EL表达式#{...}用于访问后端Bean的属性（值表达式）或调用其方法（方法表达式）。
• Bean命名： 确保EL表达式中引用的Bean名称与@Named注解中定义的名称（或默认的小写类名）完全匹配。
• 作用域： 后端Bean需要定义合适的作用域（如@RequestScoped, @ViewScoped, @SessionScoped等），以管理其生命周期和数据持久性。对于简单的表单提交，@RequestScoped通常足够；如果需要跨AJAX请求或在单个页面视图内保持状态，@ViewScoped可能更合适。

通过遵循这些原则，您可以在JSF/XHTML应用程序中有效地构建交互式用户界面，并与后端Java逻辑进行可靠的通信。

今天带大家了解了的相关知识，希望对你有所帮助；关于文章的技术知识我们会一点点深入介绍，欢迎大家关注golang学习网公众号，一起学习编程~