`
79343654
  • 浏览: 45928 次
  • 性别: Icon_minigender_1
  • 来自: 太原
社区版块
存档分类
最新评论

Struts2 jQuery Plugin Showcase 学习笔记

 
阅读更多

<%@ page contentType="text/html;charset=UTF-8" %>

<%@ taglib prefix="s" uri="/struts-tags"%>

<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<sj:head scriptPath="template/" jquerytheme="start"/>

<style>

.cl{

width:64px;height:24px;font-size:11px;padding:0px;margin:0px;

}

</style>

</head>

<body>

<!-- <div id="result1">adsf</div>

<div id="result2">adsf</div>

<div id="result3">adsf</div>

    <s:url id="ajax" value="test!ajax1.action"/>

<sj:a id="ajaxlink" 

href="%{ajax}" 

targets="result1,result2" 

indicator="indicator" 

button="true" 

buttonIcon="ui-icon-refresh"

cssClass="cl"

>

  AJAX

</sj:a>

<hr />

<div id="formResult" class="result ui-widget-content ui-corner-all">Submit form bellow.</div>

<s:form id="form" action="test!ajax2.action" theme="xhtml">

     <s:textfield id="name" name="name" value=""/><br/>

    </s:form>

<sj:a 

    id="ajaxformlink" 

    formIds="form" 

    targets="formResult" 

    indicator="indicator" 

    button="true" 

buttonIcon="ui-icon-gear"

cssClass="cl"

    >

      submit

    </sj:a>

    <img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/>

 

    <hr/>

 

 

 

    <div id="result" class="result ui-widget-content ui-corner-all">Submit form bellow.</div>

 

    <s:url id="run" value="test!ajax1.action"/>

<sj:a 

id="ajaxlink1" 

href="%{run}" 

indicator="indicator" 

targets="result" 

onClickTopics="before" 

onCompleteTopics="complete" 

effect="pulsate" 

    button="true" 

buttonIcon="ui-icon-gear"

cssClass="cl"

effect="highlight" 

effect="bounce" 

effectDuration="2200" 

effectOptions="{ color : '#FFFAAA' }" 

effectDuration="3000" 

>

 run

</sj:a>

    <img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/>    

    <br/>

    <br/>

    <sj:a 

    id="ajaxlink2" 

    href="error.html" 

    indicator="indicator2" 

    targets="result" 

    onClickTopics="before" 

    onCompleteTopics="complete" 

    onErrorTopics="errorState" 

    effect="pulsate" 

    effectDuration="1500" 

    button="true" 

buttonIcon="ui-icon-gear"

cssClass="cl"

    >

      error

    </sj:a>

    <img id="indicator2" src="images/indicator.gif" alt="Loading..." style="display:none"/>    

      <script>

    $.subscribe('beforeLink', function(event,data) {

           alert('Before request ');

           $('#result').html('Loading ...');

       });

       $.subscribe('completeLink', function(event,data) {

           $('#result').append('<br/><br/><strong>Completed request '+event.originalEvent.request.statusText+' completed with '+event.originalEvent.status+ '.</strong><br/>Status: '+event.originalEvent.request.status);

       });

       $.subscribe('errorStateLink', function(event,data) {

           $('#result').html('<br/><br/><strong>Error request '+event.originalEvent.request.statusText+' completed with '+event.originalEvent.status+ '.</strong><br/>Status: '+event.originalEvent.request.status);

       });

    </script>

 

 

    <hr/> 

 

    <s:form id="formEffect" action="test!ajax2.action" theme="xhtml">

                <s:textfield id="name" name="name" label="name" value=""/><br/>

                <sj:submit 

                targets="result5" 

                effect="blind" 

                effectMode="show"

                onEffectCompleteTopics="hideTarget"

                value="AJAX Submit" 

                indicator="indicator5" 

                button="true"

                cssClass="cl"

                effect="pulsate" 

                clearForm="true" 

                />

    </s:form>

    <img id="indicator5" src="images/indicator.gif" alt="Loading..." style="display:none"/>    

 

<div id="result5" class="result ui-widget-content ui-corner-all" style="display: none;">Submit form bellow.</div>

 

Form Submit with AJAX form Button.

<s:form id="listenForm1" action="test!ajax1.action">

<sj:submit 

id="submit1" 

value="Submit Button"

onClickTopics="listenOnClick1"

targets="result1" 

effect="highlight"

button="true"

/>

</s:form>

</div>

<div id="result1" class="ui-widget-content ui-corner-all">Result Div for Form One</div>

<br/>

<h3>Form Two</h3>

<div>

Following Form Submit Button is Listen on Submit Button in Form One.

<s:form id="listenForm2">

<s:url id="formurl1" action="test!ajax1.action" namespace="/message" />

<sj:submit 

id="submit2" 

href="%{formurl1}" 

value="Listen/Submit Button" 

formIds="listenForm2"

targets="result2" 

effect="highlight"

listenTopics="listenOnClick1" 

button="true"

/>

</s:form>

 

 

</div>

<div id="result2" class="ui-widget-content ui-corner-all">Result Div for Form Two</div>

 

 

  -->

  <s:form id="formTextarea" action="test!ajax2" theme="simple" cssClass="yform">

<s:url id="remoteurl" action="test!ajax2"/>

<sj:textarea 

href="%{remoteurl}" 

id="echo" 

name="echo" 

rows="10" 

cols="80" 

effect="highlight" 

effectDuration="1500" 

loadingText="Loading content of textarea ..."

/>

<sj:submit 

targets="result" 

effect="slide" 

value="AJAX Submit" 

indicator="indicator" 

button="true"

/>

<img id="indicator" 

src="images/indicator.gif" 

alt="Loading..." 

style="display:none"/>

    </s:form>

 

<div id="result" class="result ui-widget-content ui-corner-all" style="display:none;width:200px;height:100px;">Submit form bellow.</div>

 

</body>

</html>


分享到:
评论

相关推荐

    struts2-jquery-plugin-3.1.0.jar

    struts2-jquery-plugin-3.1.0.jar

    struts2-jquery-plugin

    struts2 jquery plugin ,学习struts2 ,又希望在其中使用Jquery的朋友,不妨看看

    struts2-jquery-plug ShowCase

    Struts2与jQuery的集成主要依赖于struts2-jquery-plugin,这个插件提供了一系列的标签库,使开发者可以直接在JSP页面中使用jQuery功能,而无需编写大量的JavaScript代码。例如,`&lt;sj:head&gt;`标签会自动引入jQuery库和...

    struts2-jquery-plugin-2.0.0

    struts2-jquery-plugin-2.0.0 struts2-jquery-plugin-2.0.0 struts2-jquery-plugin-2.0.0

    struts2-jquery-plugin插件3.3.3

    最新的struts2-jquery-plugin插件3.3.3,包括jquery-ui和grid,使用标签实现。

    struts2-jquery-plugin使用手册,自己写的

    - 可以参考官方文档或者提供的示例代码学习如何使用Struts2-jQuery-Plugin。博主的博文链接(https://79343654.iteye.com/blog/1327488)可能包含更多实战经验。 - 在实际开发中,使用浏览器的开发者工具(如...

    struts2-plugin之jquery

    Struts2-plugin之jQuery是一个关于Java Web开发中的热门框架Struts2与前端库jQuery整合使用的主题。Struts2是一款强大的MVC(Model-View-Controller)框架,它为开发者提供了处理HTTP请求、业务逻辑控制以及视图展示...

    struts2-jquery-plugin-3_7_1

    struts2-jquery-plugin jar文件

    Struts2+Jquery+Ajax

    "struts2 jar"文件包含了Struts2框架的核心库,可能包括struts2-core、struts2-convention、struts2-json-plugin等依赖,这些是开发Struts2应用必不可少的组件。 "Struts2"可能是项目实例代码,包括Action类、视图...

    jquery和struts2的整合

    &lt;script src="/struts2-jquery-plugin/js/struts2-jquery-plugin.js"&gt; &lt;link rel="stylesheet" href="/struts2-jquery-plugin/css/struts2-jquery.css" /&gt; ``` (4) **使用jQuery与Struts2交互**:利用jQuery的Ajax...

    张龙圣思园struts2学习笔记word

    张龙圣思园的Struts2学习笔记,无疑为Java开发者提供了一份宝贵的参考资料,它可能涵盖了Struts2的基础概念、核心组件、配置方式以及实战技巧。 首先,让我们深入了解Struts2的核心特性。Struts2是MVC(Model-View-...

    netbeans7.2_struts2_plugin

    首先,我们来看标题"NetBeans7.2_struts2_plugin",这表明我们要讨论的是在NetBeans 7.2版本中用于支持Struts2开发的插件。这个插件是NetBeans IDE为了提供Struts2框架的开发辅助工具而设计的,它包括了对Struts2...

    Struts2JQueryJson

    Struts2JQueryJson是一个基于Struts2框架与jQuery库,结合JSON(JavaScript Object Notation)数据格式,实现Ajax异步加载对象数据的技术方案。在Web应用开发中,这种技术可以提升用户体验,因为它允许页面部分内容...

    struts2 json plugin jar包

    struts2 json plugin jar包

    struts2-json-plugin-2.3.24-API文档-中文版.zip

    赠送jar包:struts2-json-plugin-2.3.24.jar; 赠送原API文档:struts2-json-plugin-2.3.24-javadoc.jar; 赠送源代码:struts2-json-plugin-2.3.24-sources.jar; 赠送Maven依赖信息文件:struts2-json-plugin-...

    Jquery+Struts2笔记

    例如,`struts2-jquery-plugin`提供了许多预定义的jQuery UI组件,如日期选择器、下拉菜单等,只需简单的标签即可实现。 3. **动态表单与验证**:Struts2的动态表单配合jQuery的事件处理,可以实现动态添加、删除...

    struts2-json-plugin

    struts2-json-plugin,Struts JSON插件

    struts2+jquery 插件

    struts2+jquery 整合的jar包

    struts2入门教程和学习笔记

    这个入门教程和学习笔记是针对初学者设计的,帮助他们快速理解和掌握Struts2的核心概念和实践操作。 Struts2的学习首先需要理解MVC模式。MVC模式将应用逻辑分为三个部分:模型负责业务逻辑,视图负责展示数据,而...

    struts jquery

    在实际项目中,通常会有一些特定的Struts 2与jQuery的整合库,如"struts2-jquery-plugin",它提供了一系列的标签和组件,使开发者能更快速地构建具有交互性的页面。例如,`&lt;sj:submit&gt;`标签可以实现AJAX提交,`...

Global site tag (gtag.js) - Google Analytics