输入字段未更新

时间：2012-03-18 19:35:34

标签： ajax jsf jsf-2

这是完整的源代码：http://www.sendspace.com/file/lwxpyf

我有一个JSF页面的问题，我无法解决。我有一个JSF页面，用于将应用程序设置存储到数据库表中。 这是JSF页面的源代码：

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"    
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>
        <ui:insert name="header">           
            <ui:include src="header.xhtml"/>         
        </ui:insert>
    </h:head>
    <h:body>

        <h1><img src="resources/css/images/icon.png" alt="NVIDIA.com" /> Settings Center</h1>
        <!-- layer for black background of the buttons -->
        <div id="toolbar" style="margin: 0 auto; width:1180px; height:30px; position:relative;  background-color:black">
            <!-- Include page Navigation -->
            <ui:insert name="Navigation">           
                <ui:include src="Navigation.xhtml"/>         
            </ui:insert>

        </div>  

        <div id="greenBand" class="ui-state-default ui-corner-allh" style="position:relative; top:35px; left:0px;"> 
            <h:graphicImage alt="Application Settings"  style="position:relative; top:-20px; left:9px;"  value="resources/images/logo_application_settings.png" />
        </div>
        <div id="main" style="margin: 0 auto; width:1190px; height:700px; position:absolute;  background-color:transparent; top:105px">

            <div id="mainpage" style="margin: 0 auto; width:1190px; height:500px; position:absolute;  background-color:transparent; top:80px">
                <h:form>
                    <div id="settingsdiv" style="width:550px; height:400px; position:absolute;  background-color:r; top:20px; left:1px">

                        <h:panelGrid columns="2">
                            <h:panelGroup>User Session Timeout</h:panelGroup>
                            <h:panelGroup>
                                <h:selectOneMenu value="#{ApplicationController.settings['SessionTTL']}">
                                    <f:selectItem itemValue="#{ApplicationController.settings['SessionTTL']}" itemLabel="#{ApplicationController.settings['SessionTTL']}" />
                                    <f:selectItem itemValue="two" itemLabel="Option two" />
                                    <f:selectItem itemValue="three" itemLabel="Option three" />
                                    <f:selectItem itemValue="custom" itemLabel="Define custom value" />
                                    <f:ajax render="input" />
                                </h:selectOneMenu>&nbsp;
                                <h:panelGroup id="input">
                                    <h:inputText value="#{ApplicationController.settings['SessionTTL']}" rendered="#{ApplicationController.settings['SessionTTL'] == 'custom'}" required="true" />
                                </h:panelGroup>          
                            </h:panelGroup>

                            <h:panelGroup>Maximum allowed users</h:panelGroup>
                            <h:panelGroup>
                                <h:selectOneMenu value="#{ApplicationController.settings['MaxUsersActive']}">
                                    <f:selectItem itemValue="#{ApplicationController.settings['MaxUsersActive']}" itemLabel="#{ApplicationController.settings['MaxUsersActive']}" />
                                    <f:selectItem itemValue="two" itemLabel="Option two" />
                                    <f:selectItem itemValue="three" itemLabel="Option three" />
                                    <f:selectItem itemValue="custom" itemLabel="Define custom value" />
                                    <f:ajax render="inputl" />
                                </h:selectOneMenu>&nbsp;
                                <h:panelGroup id="inputl">
                                    <h:inputText value="#{ApplicationController.settings['MaxUsersActive']}" rendered="#{ApplicationController.settings['MaxUsersActive'] == 'custom'}" required="true" />
                                </h:panelGroup>
                            </h:panelGroup>                                                                     
                        </h:panelGrid>                         



                    </div>   

                    <div id="settingsonediv" style="width:350px; height:400px; position:absolute;  background-color:transparent; top:20px; left:400px">



                    </div>   

                    <div id="settingstwodiv" style="width:150px; height:60px; position:absolute;  background-color:transparent; top:380px; left:800px">

                        <h:commandButton value="Save Settings" action="#{ApplicationController.updateDBSettings}">
                            <f:ajax render="@form" execute="@form"></f:ajax>
                        </h:commandButton>

                    </div>   


                </h:form> 
            </div>  
        </div>

    </h:body>
</html>

这是托管bean：

import java.io.Serializable;
import javax.enterprise.context.SessionScoped;
// or import javax.faces.bean.SessionScoped;
import javax.inject.Named;
/* include SQL Packages */
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.HashMap;
import javax.annotation.PostConstruct;
import javax.sql.DataSource;
import javax.annotation.Resource;
import javax.faces.context.FacesContext;
import javax.inject.Inject;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;
// or import javax.faces.bean.ManagedBean;   

import org.glassfish.osgicdi.OSGiService;

@Named("ApplicationController")
@SessionScoped
public class Application implements Serializable {

    /* This Hash Map will be used to store setting and value */
    private HashMap<String, String> settingsMap = null;    

    public Application(){     
    }   

    /* Call the Oracle JDBC Connection driver */
    @Resource(name = "jdbc/Oracle")
    private DataSource ds;


    /* Hash Map
     * Send this hash map with the settings and values to the JSF page
     */
    public HashMap<String, String> getsettings(){
        return settingsMap;        
    }

    /* Get a Hash Map with settings and values. The table is genarated right 
     * after the constructor is initialized. 
     */
    @PostConstruct
    public void initSettings() throws SQLException
    {        
        settingsMap = new HashMap<String, String>();

        if(ds == null) {
                throw new SQLException("Can't get data source");
        }
        /* Initialize a connection to Oracle */
        Connection conn = ds.getConnection(); 

        if(conn == null) {
                throw new SQLException("Can't get database connection");
        }
        /* With SQL statement get all settings and values */
        PreparedStatement ps = conn.prepareStatement("SELECT * from GLOBALSETTINGS");

        try
        {
            //get data from database        
            ResultSet result = ps.executeQuery();
            while (result.next())
            {
               settingsMap.put(result.getString("SettingName"), result.getString("SettingValue"));
            }            
        }
        finally
        {
            ps.close();
            conn.close();         
        }        
    }

    /* JSF returns the updated values into the HashMap */

    /* Update Settings Values */
    public void updateDBSettings() throws SQLException {

            String SQL_Statement = null;

            if (ds == null) throw new SQLException();      
        Connection conn = ds.getConnection();
            if (conn == null) throw new SQLException();      

    try {
        conn.setAutoCommit(false);
        boolean committed = false;
            try {  
                   /* Insert the new settings values with one SQL statement */
                   SQL_Statement = "UPDATE GLOBALSETTINGS " +
                                        "SET \"SettingValue\" = " +
                                          "CASE " +
                                            "WHEN \"SettingName\" = 'SessionTTL' THEN ? " +
                                            "WHEN \"SettingName\" = 'MaxUsersActive' THEN ? " +
                                          "END " +
                                   "WHERE \"SettingName\"  IN ('SessionTTL', 'MaxUsersActive')";
                   /* Exete thre SQL statement */
                   PreparedStatement updateQuery = conn.prepareStatement(SQL_Statement);
                   updateQuery.setString(1, settingsMap.get("SessionTTL"));
                   updateQuery.setString(2, settingsMap.get("MaxUsersActive"));

                   updateQuery.executeQuery();                                                         
                   conn.commit();
                   committed = true;
               } finally {
                   if (!committed) conn.rollback();
                   }
            }
            finally {
            /* Release the resource after all SQL queries are executed */
            conn.close();                
            }             
            /* Refresh Hash Map
             * Get again settings from Oracle
             */
           initSettings();

     }    


}

这是我面临的问题：

当我打开JSF页面时，我得到了这个菜单：

enter image description here

然后我从菜单中选择自定义：

enter image description here

我在菜单旁边输入了这个输入字段：

enter image description here

然后我从键盘输入自定义值：

enter image description here

但是当我点击“保存”按钮时，我得到了这个。我可以看到数据库字段已更新，但值是“自定义”

enter image description here

当我输入相同的两倍值时，我得到了这个：

enter image description here

我似乎在点击custom并输入自定义值时，HashMap未更新。奇怪的是，当我再次执行此操作时，HashMap会更新并且值正确。我该如何解决这个问题？

祝福

编辑

我怀疑JSF版本会导致此问题。这是faces-config.xml

的内容 
 <?xml version="1.0"?>
    <faces-config xmlns="http://java.sun.com/xml/ns/javaee" 
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
          http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd"
       version="2.0">
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>ApplicationController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Application</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>DashboardController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Dashboard</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>DatabaseController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Database</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>GeneralController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.General</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>GlassfishController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Glassfish</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>LinuxController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Linux</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>LinuxConfigurationController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.LinuxConfiguration</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>LogController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Log</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>    
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>OracleController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Oracle</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>
        <managed-bean>
            <description>comment</description>
            <managed-bean-name>UpdatesController</managed-bean-name>
            <managed-bean-class>com.DX_57.SM_57.Updates</managed-bean-class>    
            <managed-bean-scope>request</managed-bean-scope>        
        </managed-bean>   
    </faces-config>

这是beans.xml

的内容 
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/beans_1_0.xsd">
</beans>

这是web.xml

的内容 
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.0" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
    <context-param>
        <param-name>javax.faces.PROJECT_STAGE</param-name>
        <param-value>Development</param-value>
    </context-param>
    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>*.jsf</url-pattern>
    </servlet-mapping>

    <welcome-file-list>
        <welcome-file>index.html</welcome-file>
    </welcome-file-list>
</web-app>

如何更改它们以使用最新的JSF版本？

编辑2 我在Firefox中禁用了JavaScript。我测试了代码。事实证明它有效，但我每次都要点击保存按钮：

enter image description here

我选择自定义并单击“保存按钮”

enter image description here

enter image description here

单击“保存”按钮时，将显示自定义字段。

enter image description here

当我输入自定义值并单击“保存”按钮时，该字段将更新。

我认为它不起作用，因为数据不会从JavaScrips发送回服务器

编辑3 来自firebug的调试信息：

我从菜单自定义中选择：

<update id="j_idt5:input"><![CDATA[<span id="j_idt5:input"><input type="text" name="j_idt5:j_idt15" value="custom" /></span>]]></update>

我输入自定义值：

<?xml version='1.0' encoding='UTF-8'?>
<partial-response><changes><update id="j_idt5"><![CDATA[
<form id="j_idt5" name="j_idt5" method="post" action="/SM_57-1.0-SNAPSHOT/Application.jsf" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="j_idt5" value="j_idt5" />
<table>
<tbody>
<tr>
<td>User Session Timeout</td>
<td><select id="j_idt5:j_idt10" name="j_idt5:j_idt10" size="1" onchange="mojarra.ab(this,event,'valueChange',0,'j_idt5:input')">    <option value="custom" selected="selected">custom</option>
    <option value="two">Option two</option>
    <option value="three">Option three</option>
    <option value="custom" selected="selected">Define custom value</option>
</select><span id="j_idt5:input"><input type="text" name="j_idt5:j_idt15" value="custom" /></span></td>
</tr>
<tr>
<td>Maximum allowed users</td>
</tr>
</tbody>
</table>
<input id="j_idt5:j_idt18" type="submit" name="j_idt5:j_idt18" value="Save Settings" onclick="mojarra.ab(this,event,'action','@form','@form');return false" />
</form>]]></update><update id="javax.faces.ViewState"><![CDATA[-8356663926661541536:7758149566419150570]]></update></changes></partial-response>

我点击保存按钮：

<?xml version='1.0' encoding='UTF-8'?>
<partial-response><changes><update id="j_idt5"><![CDATA[
<form id="j_idt5" name="j_idt5" method="post" action="/SM_57-1.0-SNAPSHOT/Application.jsf" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="j_idt5" value="j_idt5" />
<table>
<tbody>
<tr>
<td>User Session Timeout</td>
<td><select id="j_idt5:j_idt10" name="j_idt5:j_idt10" size="1" onchange="mojarra.ab(this,event,'valueChange',0,'j_idt5:input')">    <option value="wdwdew" selected="selected">wdwdew</option>
    <option value="two">Option two</option>
    <option value="three">Option three</option>
    <option value="custom">Define custom value</option>
</select><span id="j_idt5:input"></span></td>
</tr>
<tr>
<td>Maximum allowed users</td>
</tr>
</tbody>
</table>
<input id="j_idt5:j_idt18" type="submit" name="j_idt5:j_idt18" value="Save Settings" onclick="mojarra.ab(this,event,'action','@form','@form');return false" />
</form>]]></update><update id="javax.faces.ViewState"><![CDATA[-8356663926661541536:7758149566419150570]]></update></changes></partial-response>

3 个答案:

答案 0 :(得分：7)

您已在faces-config.xml中重新确定了bean。您的托管bean已被重新确定为请求范围：

<managed-bean>
    <description>comment</description>
    <managed-bean-name>ApplicationController</managed-bean-name>
    <managed-bean-class>com.DX_57.SM_57.Application</managed-bean-class>    
    <managed-bean-scope>request</managed-bean-scope>        
</managed-bean>

faces-config.xml文件中的托管bean配置在注释上具有优先级。您的ApplicationController bean实际上是一个请求范围的JSF托管bean，而不是像注释声明的会话范围的CDI托管bean。在每一个ajax请求中，都会创建一个全新的。在以前的请求中完成的所有更改都被“遗忘”。

您有两个选择：

  • 从faces-config.xml。
    • 中删除bean配置
  • 将托管bean范围更改为view（请注意，它仍将是管理bean实例的JSF，而不是CDI，而且CDI没有合适的@ViewScoped注释）。

答案 1 :(得分：2)

尝试添加f:ajax，以便将表单中的数据提交给服务器

用这个替换你的保存btn 

<h:commandButton value="Save Settings" action="#{applicationController.updateDBSettings}">
    <f:ajax render="@form" execute="@form"></f:ajax>
</h:commandButton>

为了查看问题所在：尝试从updateDBSettings（）的末尾删除对initSettings()的调用，或者确保重新初始化确实使用正确的值填充了地图... < / p>

修改

在Chrome中打开您的应用程序并单击F12，在开发工具中单击脚本选项卡，然后在右下方您可以看到所有已加载的js文件，您在那边看到任何可疑的“库”吗？尝试从你的页面中删除它的包含...以查看导致FF错误的原因

答案 2 :(得分：-1)

我认为你应该重新定义

<managed-bean-scope>request</managed-bean-scope>

使用

<managed-bean-scope>session</managed-bean-scope>

代替

相关问题
最新问题