博客介绍了JSP界面与Action层数值传递的同步和异步方式。同步时，JSP界面操作与Action层数据相互传值会使界面整体变化；异步则通过Ajax传值，界面仅局部变化。还展示了相关的js、html和Action中的Java代码。
同步与异步
我个人通过操作，理解为：
1）同步指jsp界面的操作与action层数据相互传值，jsp界面整体发生变化。
2）异步指jsp界面的操作与action层数值传值通过ajax的方式传递，jsp界面只是局部发生变化。
jsp界面与action之间的数值传递
代码展示
1）js代码
<script type="text/javascript">
var b = function(idate,busId,inspectId){
$.ajax({
url:"${basePath}schdBus/busInspect_compareDate.action",
data:{"idate":idate,"busId":busId,"inspectId":inspectId},
type:"post",
success: function(msg){
//2、更新状态栏、操作栏的显示值
if("OK" == msg){
i.innerHTML="OK";
i.style.color="green";
} else if("NO1" == msg){
i.innerHTML="该日期已输入";
i.style.color="red";
} else if("NO2" == msg){
i.innerHTML="日期为空，请输入";
i.style.color="red";
} else if("NO3" == msg){
i.innerHTML="班车为空，请输入";
i.style.color="red";
} else{
i.innerHTML="系统错误";
i.style.color="red";
}
},
error: function(){
alert("查询失败");
return false;
}
});
}
function doSubmit(){
var busId = document.getElementById("busId").value;
var idate = document.getElementById("d421").value;
var inspectId = document.getElementById("inspectId").value;
var lc = document.getElementById("lc");
var i = document.getElementById("i");
if(busId==null||busId==""){
alert("请输入所运行班车");
lc.innerHTML="请输入";
lc.style.color="red";
return false;
}else if(idate==null||idate==""){
alert("请输入日期");
i.innerHTML="请输入";
i.style.color="red";
return false;
} else{
document.forms[0].submit();
}
}
function doDate(idate){//一旦触发日期可能为空也可能不为空
var busId = document.getElementById("busId").value;
var i = document.getElementById("i");
var inspectId = document.getElementById("inspectId").value;
if(busId!=null||busId!=""){
if(idate!=null||idate!=""){//日期不为空
b(idate,busId,inspectId);//确定重复
}else{//日期为空
i.innerHTML="日期为空，请输入";
}
}else{
i.innerHTML="班车为空，请输入";//班车为空
i.style.color="red";
}
}
function doSelect(myLicence){ //一旦触发班车可能为空也可能不为空,获得车牌照号
var idate = document.getElementById("d421").value;//获得日期
var busId = document.getElementById("busId").value;//获得班车号
var inspectId = document.getElementById("inspectId").value;//获取点检号
var lc = document.getElementById("lc"); //班车后文本显示点
var i = document.getElementById("i"); //日期后文本现实点
if(myLicence==0||myLicence==null){ //班车为空
lc.innerHTML="班车为空，请输入";
lc.style.color="red";
}else{ //班车不为空 ，不考虑日期为空，空就什么都不操作，不为空就判断是否重复
lc.innerHTML="OK";
lc.style.color="green";
if(idate!=null||idate!=""){//如果日期不为空，进行是否重复确定
b(idate,busId,inspectId);//确定重复
}
}
};
2）html代码
<s:form action="busInspect_%{inspect == null ? 'add' : 'edit'}" >
<s:hidden id="inspectId" name="inspect.inspectId"></s:hidden>
<!-- 表单内容显示 -->
<div class="ItemBlockBorder">
<div class="ItemBlock">
<table cellpadding="0" cellspacing="0" class="mainForm">
<tr>
<td width ="100">运行班车</td>
<td >
<s:select id="busId" name="busId" cssClass="SelectStyle"
list="busList" listKey="busId" listValue="licence"
headerKey="" headerValue="==请选择班车==" onchange="doSelect(this.value)"
>
</s:select>
<span id="lc" ><font color="red"><s:property value="errorMeg1"></s:property></font></span>
</td>
</tr>
<tr>
<td>检查日期</td>
<td>
<s:textfield id="d421" name="inspect.idate" cssClass="InputStyle" readonly="true"
onfocus="WdatePicker({skin:'whyGreen', el:'d421',dateFmt:'yyyy-MM-dd',maxDate: '%y-%M-%d' })"
onchange="doDate(this.value)"><!-- 已经按照js文件调整为只能到今日的日期 -->
<s:param name="value"><s:date name='inspect.idate' format='yyyy-MM-dd' /></s:param>
</s:textfield>
<span id="i"><font color="red"><s:property value="errorMeg2"></s:property></font></span>
</td>
</tr>
<tr>
<td>班车卫生</td>
<td><s:textfield id ="tf" name="inspect.envir" value ="干净" cssClass="InputStyle" /> *<span id = tfValue></span></td>
</tr>
<tr>
<td>灯光</td>
<td><s:textfield id ="tf1" name="inspect.light" value = "正常" cssClass="InputStyle"/> *</td>
</tr>
<tr>
<td>发动机</td>
<td ><s:textfield id ="tf2" name="inspect.generator" value = "正常" cssClass="InputStyle"/> *</td>
</tr>
<tr>
<td>是否漏液</td>
<td ><s:textfield id ="tf3" class ="textfield1" name="inspect.weeping" value = "无" cssClass="InputStyle"/> *</td>
</tr>
<tr>
<td>证件齐全</td>
<td ><s:textfield id ="tf4" class ="textfield1" name="inspect.credent" value = "齐全" cssClass="InputStyle"/> *</td>
</tr>
<tr>
<td>仪表正常</td>
<td ><s:textfield id ="tf5" class ="textfield1" name="inspect.meter" value = "正常" cssClass="InputStyle"/> *</td>
</tr>
<tr>
<td>物件损坏</td>
<td ><s:textfield id ="tf6" class ="textfield1" name="inspect.damage" value = "无" cssClass="InputStyle"/> *</td>
</tr>
<tr>
<td>描述</td>
<td><s:textarea id="description" name="inspect.description" class="TextareaStyle"></s:textarea></td>
</tr>
</table>
</div>
</div>
</s:form>
3）action中java代码
public class InspectAction extends BaseAction {
/**
*
*/
private static final long serialVersionUID = 8311219980332495949L;
@Resource
private InspectService inspectService;
@Resource
private BusService busService;
private Inspect inspect;
private Bus bus;
private List<Inspect> inspectList;
private List<Bus> busList;
private String idate;
private String busId;
private String inspectId;
public String errorMeg1 =null;
public String errorMeg2 =null;
//列表页面
public String list(){
QueryHelper queryHelper =new QueryHelper(Inspect.class, "i");
pageResult = inspectService.getPageResult(queryHelper, pageNum, pageSize);
return "list";
}
//跳转到新增页面!
public String addUI(){
//加载班车列表
busList = busService.findObjects();
return "saveUI";
}
//保存新增
public String add(){
inspect.setBus(busService.findObjectById(busId));
if(inspect!=null){
inspectService.save(inspect);
}
return "tolist";
}
//跳转到编辑页面
public String editUI(){
busList=busService.findObjects();
Log log = LogFactory.getLog(getClass());
log.info("busList's value:"+busList);
if(inspect!=null&&inspect.getInspectId()!=null){
inspect = inspectService.findObjectById(inspect.getInspectId());
}
if(inspectService.findObjectById(inspect.getInspectId()).getBus()!=null){
//处理班车回显
busId = inspectService.findObjectById(inspect.getInspectId()).getBus().getBusId();
}
System.out.println("busId :"+busId);
return "saveUI";
}
public void compareDate() {
long x;//重复查询数量值存放容器
String y = "NO3";//返回值容器
if(inspectId!=null){ //如果不为空就装载
inspect = inspectService.findObjectById(inspectId);
}
QueryHelper queryHelper =new QueryHelper(Inspect.class, "i");
try {
if(!Util.isEmptyString(busId)){//再次判断班车是否为空，提高严谨性
if(!Util.isEmptyString(idate)){//再次判断日期是否为空，提高严谨性
queryHelper.addCondition("i.bus.busId = ?", busId)
.addCondition("i.idate = ?", new SimpleDateFormat("yyyy-MM-dd").parse(idate));
if(inspect!=null && inspect.getInspectId()!=null){//如果不为空就添加查询项
queryHelper.addCondition("i.inspectId != ?",inspect.getInspectId());
}
x = inspectService.count(queryHelper); //获得查询值
System.out.println(x);
if(x == 0){
y="OK";
System.out.println(y);
}else{
y="NO1";
System.out.println(y);
}
}else{
y="NO2";
System.out.println(y);
}
}
System.out.println(y);
//输出更新结果
HttpServletResponse response = ServletActionContext.getResponse();
response.setContentType("text/html");
ServletOutputStream outputStream = response.getOutputStream();
outputStream.write(y.getBytes("utf-8"));
outputStream.close();
} catch (Exception e) {
e.printStackTrace();
}
}
//保存编辑
public String edit(){
long x;//重复查询数量值存放容器
QueryHelper queryHelper =new QueryHelper(Inspect.class, "i");
try {
if(!Util.isEmptyString(busId)){//再次判断班车是否为空，提高严谨性
if(inspect.getIdate()!=null){//再次判断日期是否为空，提高严谨性
queryHelper.addCondition("i.bus.busId = ?", busId)
.addCondition("i.idate = ?", inspect.getIdate());
if(inspect!=null && inspect.getInspectId()!=null){//如果不为空就添加查询项
queryHelper.addCondition("i.inspectId != ?",inspect.getInspectId());
}
x = inspectService.count(queryHelper); //获得查询值
System.out.println(x);
if(x == 0){
bus = busService.findObjectById(busId);
inspect.setBus(bus);
inspectService.update(inspect);
return list();
}else{
errorMeg1 ="";
errorMeg2 ="该日期已输入";
}
}else{
errorMeg1 ="";
errorMeg2 ="日期为空，请输入";
}
}else{
errorMeg1 ="班车为空，请输入";
errorMeg2 ="";
}
return editUI();
} catch (Exception e) {
e.printStackTrace();
}
return "tolist";
}
//删除
public String delete(){
if(inspect != null && inspect.getInspectId() != null){
inspectService.delete(inspect.getInspectId());
}
return "tolist";
}
public void dd(){
HttpServletRequest request = ServletActionContext.getRequest();
Enumeration<String> keys = request.getParameterNames();
while(keys.hasMoreElements()){
String k = keys.nextElement();
System.out.println(k + " = " +request.getParameter(k));
}
}
public List<Inspect> getInspectList() {
return inspectList;
}
public void setInspectList(List<Inspect> inspectList) {
this.inspectList = inspectList;
}
public String getBusId() {
return busId;
}
public void setBusId(String busId) {
this.busId = busId;
}
public List<Bus> getBusList() {
return busList;
}
public void setBusList(List<Bus> busList) {
this.busList = busList;
}
public Inspect getInspect() {
return inspect;
}
public void setInspect(Inspect inspect) {
this.inspect = inspect;
}
public String getIdate() {
return idate;
}
public void setIdate(String idate) {
this.idate = idate;
}
public Bus getBus() {
return bus;
}
public void setBus(Bus bus) {
this.bus = bus;
}
public String getInspectId() {
return inspectId;
}
public void setInspectId(String inspectId) {
this.inspectId = inspectId;
}
public String getErrorMeg1() {
return errorMeg1;
}
public void setErrorMeg1(String errorMeg1) {
this.errorMeg1 = errorMeg1;
}
public String getErrorMeg2() {
return errorMeg2;
}
public void setErrorMeg2(String errorMeg2) {
this.errorMeg2 = errorMeg2;
}
}
扫一扫
2010
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
