这是我的表
假设我在表中有10个用户并且我点击用户ID 2进行编辑,bootsfaces模式将表中的最后一个用户显示为模态;这是用户ID 10.
<div class="tab-pane fade" id="add9">
<h:form class="form-horizontal" >
<h3 class="title-section title-bar-high mb-40">System User Report</h3>
<div class="orders-info">
<div class="table-responsive">
<b:dataTable class="table table-bordered table-responsive" var="user" value="#{userBean.findsAll()}" onorder="console.log('order');" onselect="ajax:userBean.editUser(user)" onpage="console.log('page');" >
<h:column>
<f:facet name="header">Sr. No.</f:facet>
<h:outputText value="#{user.id}" />
</h:column>
<h:column>
<f:facet name="header">Name</f:facet>
<h:outputText value="#{user.userName}" />
</h:column>
<h:column>
<f:facet name="header">Status</f:facet>
<h:outputText value="#{user.userLevel}" />
</h:column>
<h:column>
<f:facet name="header">Mobile</f:facet>
<h:outputText value="#{user.userPhone}" />
</h:column>
<h:column>
<f:facet name="header">Email</f:facet>
<h:outputText value="#{user.userEmail}" />
</h:column>
<h:column>
<f:facet name="header">Date</f:facet>
<h:outputText value="#{user.userDate}" />
</h:column>
<h:column>
<f:facet name="header">Action</f:facet>
<b:commandButton iconAwesome="pencil" look="link" action="#{userBean.editUser(user)}" onclick="$('.modalPseudoClass').modal();return false;">
<f:ajax execute="#{userBean.editUser(user)}" render="@none" />
</b:commandButton>
<b:commandButton action="#{userBean.deleteUser(user)}" onclick="return confirm('You Are About You Delete This User!')" iconAwesome="trash" look="link">
</b:commandButton>
</h:column>
</b:dataTable>
</div>
</div>
</h:form>
</div>
这是我的bean控制器
public class UserBean implements Serializable {
@EJB
private UserFacade userFacade;
private User user;
public UserBean() {
user = new User();
}
public UserFacade getUserFacade() {
return userFacade;
}
public void setUserFacade(UserFacade userFacade) {
this.userFacade = userFacade;
}
public User getUser() {
return user;
}
public void setUser(User user) {
this.user = user;
}
public void deleteUser(User user){
userFacade.remove(user);
}
public void editUser(User user){
this.user = user;
}
public void editUser(){
userFacade.edit(this.getUser());
user = new User();
}
}
这是我的bootsfaces模式
<f:view>
<h:form class="form-horizontal">
<b:modal id="amodal" title="Basic info and Contact No. #{userBean.user.id}" styleClass="modalPseudoClass">
<div class="profile-details tab-content">
<div class="personal-info">
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="userName">User Name:</h:outputLabel>
<div class="col-sm-9">
<h:inputText class="form-control" id="userName" value="#{userBean.user.userName}" title="UserName" requiredMessage="" />
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="firstName">First Name:</h:outputLabel>
<div class="col-sm-9">
<h:inputText class="form-control" id="firstName" value="#{userBean.user.firstName}" title="FirstName" requiredMessage="" />
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="lastName">last-name:</h:outputLabel>
<div class="col-sm-9">
<h:inputText class="form-control" id="lastName" value="#{userBean.user.lastName}" title="LastName" requiredMessage="" />
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="userEmail">E-mail Address:</h:outputLabel>
<div class="col-sm-9">
<h:inputText class="form-control" id="userEmail" value="#{userBean.user.userEmail}" title="UserEmail" requiredMessage="" />
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="userPostal">Zip Code:</h:outputLabel>
<div class="col-sm-9">
<h:inputText class="form-control" id="userPostal" value="#{userBean.user.userPostal}" title="UserPostal" requiredMessage="" />
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="userPhone">Phone:</h:outputLabel>
<div class="col-sm-9">
<h:inputText class="form-control" id="userPhone" value="#{userBean.user.userPhone}" title="UserPhone" requiredMessage="" />
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="userCountry">Country:</h:outputLabel>
<div class="col-sm-9">
<div class="custom-select">
<h:selectOneMenu id="userCountry" value="#{userBean.user.userCountry}" title="UserCountry" class="select2">
<f:selectItem itemValue = "o" itemLabel = "Please Select" />
<f:selectItem itemValue = "Bangladesh" itemLabel = "Bangladesh" />
<f:selectItem itemValue = "Spain" itemLabel = "Spain" />
<f:selectItem itemValue = "Belgium" itemLabel = "Belgium" />
<f:selectItem itemValue = "Ecuador" itemLabel = "Ecuador" />
<f:selectItem itemValue = "Ghana" itemLabel = "Ghana" />
<f:selectItem itemValue = "South Africa" itemLabel = "South Africa" />
<f:selectItem itemValue = "India" itemLabel = "India" />
<f:selectItem itemValue = "Pakistan" itemLabel = "Pakistan" />
<f:selectItem itemValue = "Thailand" itemLabel = "Thailand" />
<f:selectItem itemValue = "Malaysia" itemLabel = "Malaysia" />
<f:selectItem itemValue = "Italy" itemLabel = "Italy" />
<f:selectItem itemValue = "Japan" itemLabel = "Japan" />
</h:selectOneMenu>
</div>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="userLevel">User Level:</h:outputLabel>
<div class="col-sm-9">
<div class="custom-select">
<h:selectOneMenu class="select2" id="userLevel" value="#{userBean.user.userLevel}" title="UserLevel">
<f:selectItem itemLabel="Choose item" noSelectionOption="true" />
<f:selectItems value="#{userBean.findAllUserRole()}" var="user" itemLabel="#{user.name}" itemValue="#{user.name}" />
<f:ajax render="#{user.name}" />
</h:selectOneMenu>
</div>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" value="Town / City:" for="userTown" />
<div class="col-sm-9">
<h:inputText class="form-control" id="userTown" value="#{userBean.user.userTown}" title="UserTown" requiredMessage="" />
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<h:outputLabel class="col-sm-3 control-label" for="userAbout">About Me:</h:outputLabel>
<div class="col-sm-9">
<h:inputTextarea class="form-control" id="userAbout" value="#{userBean.user.userAbout}" title="UserAbout" requiredMessage="" style="height: 150px;" rows="8" />
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<f:facet name="footer">
<div class="form-group mb-none">
<div class="col-sm-3">
<b:commandButton value="Save" look="success" style="width:80px" action="#{userBean.editUser()}" a:dismiss="modal" />
</div>
<div class="col-sm-3">
<b:button value="Close" look="warning" style="width:80px" dismiss="modal" />
</div>
</div>
</f:facet>
</div>
</b:modal>
</h:form>
</f:view>
答案 0 :(得分:0)
当用户选择行时,您需要更新模态的内容。您知道,数据表和模态是同一个XHTML文件的一部分,因此它们同时呈现。当然,这太早了,所以如果没有更新,模态会显示错误的用户。
顺便说一句,我认为将user
重命名为selectedUser
,将其初始化为null,并仅在selectedUser
为editUser()
时才呈现模态的内容是一个好主意。不是空的。这样,你会注意到什么时候出错了。此外,更少的HTML代码将发送到客户端。
与您的问题没有直接关系:您的代码段多次调用if (context.Request.Method == "OPTIONS")
{
context.Response.Headers.Add("Access-Control-Allow-Origin", new[] { (string)context.Request.Headers["Origin"] });
context.Response.Headers.Add("Access-Control-Allow-Headers", new[] { "Origin, X-Requested-With, Content-Type, Accept, Authorization" });
context.Response.Headers.Add("Access-Control-Allow-Methods", new[] { "GET, POST, PUT, DELETE, OPTIONS" });
context.Response.Headers.Add("Access-Control-Allow-Credentials", new[] { "true" });
}
。你可能想做一些家务。