使用DOJO在java webwork项目中无刷新提交尝试

前端之家收集整理的这篇文章主要介绍了使用DOJO在java webwork项目中无刷新提交尝试前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

先记录一下,网上相关的东西太少,希望能抛砖引玉
---------------------------
公司开发了一个新项目,希望能快速生成代码,经过多次讨论选择了Appfuse1.9.3-webwork分支?不明白其中的过程,但是既然选择了就要搞定不是?

Appfuse1.9.3-webwork,下面简称Appfuse。由hibernate+spring+webwork+sitemesh+ajax等一揽子当今牛X的开源项目组成,其中WW还集成使用了DOJO等东东。
---------------------------
经过测试,WW所用的DOJO版本V0.2和新的V0.3没有冲突,引入0.3版本,主要使用其封装的页面控件和无刷新提交。

下面的JSP页面是一个大的页面下面包括多个子form,每个子form要独立提交,各个子form不在同一个transaction中
页面片段:

  1. <divid="jj_edit">
  2. <!--rightbegin-->
  3. <divid="apply_msg"dojoType="TabContainer">
  4. <c:iftest="${判断条件}">//满足判断条件则显示
  5. <divid="lftb1"dojoType="ContentPane"label="ApplyForm"
  6. href="/ICardApp/includepage/editApplyForm.action?method=Add&from=list">
  7. </div>
  8. <scripttype="text/javascript">
  9. formCont.add("saveApplyForm","apply_msg");
  10. formPane.add("saveApplyForm","lftb1");
  11. </script>
  12. </c:if>
  13. <c:iftest="${判断条件}">//满足判断条件则显示
  14. <divid="lftb2"dojoType="ContentPane"label="ContactClien"
  15. href="/ICardApp/includepage/editContactClient.action?method=Add&from=list">
  16. </div>
  17. <scripttype="text/javascript">
  18. formCont.add("saveContactClient","apply_msg");
  19. formPane.add("saveContactClient","lftb2");
  20. </script>
  21. </c:if>
  22. </div>

js变量定义
  1. <scripttype="text/javascript"src="<c:urlvalue='/scripts/dojo.js'/>"></script>
  2. <scripttype="text/javascript">
  3. vardjConfig={isDebug:true};
  4. dojo.require("dojo.widget.TabContainer");
  5. dojo.require("dojo.widget.LinkPane");
  6. dojo.require("dojo.widget.ContentPane");
  7. dojo.require("dojo.collections.Dictionary");
  8. varformCont=newdojo.collections.Dictionary();//定义子form所在的TabContainer和ContentPane标签队列
  9. varformPane=newdojo.collections.Dictionary();
  10. varupdatedform=document.forms;
  11. </script>

重点来啦,提交脚本如下:

  1. <scripttype="text/javascript">
  2. functionmain_form_submit(){//总页面提交
  3. synfunc();
  4. }
  5. functionsynfunc(){//顺序提交各个页面
  6. for(vari=0;i<updatedform.length;i++){
  7. vartmpform=updatedform[i];
  8. if(tmpform.updated==true){
  9. varbindArgs={
  10. url:tmpform.action,
  11. mimetype:"text/plain",
  12. timeoutSeconds:5000,
  13. method:"POST",
  14. formNode:document.getElementById(tmpform.id),
  15. handle:function(type,data,evt){
  16. if(type=="load"){
  17. document.getElementById(formPane.entry(tmpform.id)).innerHTML=data;
  18. synfunc();
  19. }elseif(type=="error"){
  20. //tmpform.updated=false;
  21. alert("Anerroroccurred.");//here,"data"isourerrorobject
  22. }elseif(type=="timeout"){
  23. //tmpform.updated=false;
  24. alert("outoftime!");
  25. }
  26. }
  27. };
  28. dojo.io.bind(bindArgs);
  29. break;
  30. }//endifupdated==true
  31. }//endfor
  32. }
  33. </script>

其中,contactClientForm.jsp页面代码如下:
  1. <%@includefile="/common/taglibs.jsp"%>
  2. <ww:formname="contactClientForm"action="saveContactClient"method="post"validate="true">
  3. <ww:hiddenname="contactClient.contactClientId"value="%{contactClient.contactClientId}"/>
  4. <ww:textfieldlabel="%{getText('contactClient.contactType')}"name="contactClient.contactType"
  5. value="%{contactClient.contactType}"required="true"onchange="this.form.updated=true;"/>
  6. <ww:textfieldlabel="%{getText('contactClient.affirmType')}"name="contactClient.affirmType"
  7. value="%{contactClient.affirmType}"required="true"onchange="this.form.updated=true;"/>
  8. <ww:textfieldlabel="%{getText('contactClient.letter')}"name="contactClient.letter"
  9. value="%{contactClient.letter}"required="true"onchange="this.form.updated=true;"/>
  10. </ww:form>

欢迎拍砖。


声明:JavaEye文章版权属于作者,受法律保护。没有作者书面许可不得转载。若作者同意转载,必须以超链接形式标明文章原始出处和作者。 原文链接:https://www.f2er.com/dojo/291984.html

猜你在找的Dojo相关文章