struts2中使用ajax so easy!!!

在struts2中使用ajax是非常简单的，并且借助ajax就更加简单了，废话不多说，直接上代码吧：

一般我们在操作删除，修改等操作时，一般需要进行两次操作，一次是具体的操作，另一次是页面的加载，一次一般都是要传入两个action的

//删除试题： 批量删除
function deleteSub(delTagAction,listTagAction){
//得到当前的页码
    var currentPage=$("#currentPage").val();
//以下是得到选中的复选框
    var ids=new Array();
    if($("input[name='id']:checked").size()==0){
        alert("请选择需要删除的题目！");
        return false;
        
    }
    $("input[name='id']:checked").each(function(i,obj){
        ids[i]=$(obj).val();
    });
    var idStr=ids.join("-");
    $.ajax({
        url:delTagAction,
        data:{
            sendTime:(new Date()).getTime(),
            idStr:idStr
        },
        type:"post",
        async:false,
        dataType:"json",
        success:function(data){
            if(data.success){
                $("#middle").load(listTagAction,
                        {
                            sendTime:(new Date()).getTime(),
                            currentPage:currentPage
                        }
                )
                alert("删除成功！！！");
            }else{
                alert("删除失败，请联系开发人员！！！");
            }
        }
    });
}

页面根据事件来调用该ajax就可以了，传入的两个参数分别是1.删除操作的action 2.操作成功后要加载的页面action

struts.xml：

<action name="页面需要加载的action" class="xidian.sl.action.exam.SingleSubAction" method="singDetail">
              <result name="success" type="freemarker">/WEB-INF/admin/加载页面</result>
          </action>
          <action name="删除操作的action" class="xidian.sl.action.exam.SingleSubAction" method="updateSing">
              <result name="success">/WEB-INF/responseMsg.jsp</result>
          </action>

删除操作的action:(里面的response就是一个字符串，可以更换其他名字)

//删除单选题
    public String deleteSing(){
        try{
            singleSubService.deleteSingleSub(idStr);        //删除
            response="{success:true}";
        }catch(Exception e){
            response="{success:false}";
            e.printStackTrace();
        }
        return SUCCESS;
    }

操作成功后会回到struts2.xml中，页面先回到/WEB-INF/responseMsg.jsp，这个jsp只是间接输出消息的

<%@ taglib prefix="s" uri="/struts-tags"%>
<% response.setCharacterEncoding("UTF-8"); %>
<% System.out.println(response); %>
<s:property value="response" escape="false"/>

 

另外一种提交方式就是，使用submit提交整个表单（form）使用ajax

表单代码如下：

<div class="controltitle">当前操作：信息管理——>添加学生信息</div>
<form action ="inforAddAction.action" method ="POST" name="inforAdd" enctype="multipart/form-data" id="inforAddForm" 
            onsubmit="return checkAdd(this);">
    <table class="tablefirst" id="radioSub">
            <col style="width:5%"/>
            <col style="width:10%"/>
               <col style="width:5%"/>
            <col style="width:10%"/>
            <tr>
            <th>操作明细</th><th>写入</th><th>操作明细</th><th>写入</th>
            </tr>
               <tr>
                   <td>学生姓名：</td>
                   <td><input type = "text" name = "stuInfor.stuName" id = "stu_name"></td>
                <td>学生性别：</td>
                <td><input type="radio"  name = "stuInfor.stuSex"  id="stu_sex" value = "男" checked>&nbsp;男&nbsp;&nbsp;&nbsp;&nbsp;
                    <input type="radio"  name = "stuInfor.stuSex"  id="stu_sex" value = "女">&nbsp;女</td>
               </tr>
               <tr>
                   <td>学生学号：</td>
                   <td><input type = "text" name = "stuInfor.stuNum" id = "stu_name"></td>
                <td>所属专业：</td>
                <td>
                    <select name = "stuInfor.stuZy" id = "stu_name">
                        <option value="眼视光七年制">眼视光七年制</option>
                        <option value="眼视光本科">眼视光本科</option>
                        <option value="眼视光专科">眼视光专科</option>
                    </select>
                </td>
               </tr>
               <tr>
                   <td>专业学制:</td>
                   <td><input type = "text" name = "stuInfor.stuXz" id = "stu_name"></td>
                <td>学生籍贯:</td>
                <td><input type = "text" name = "stuInfor.stuJg" id = "stu_name"></td>
               </tr>
               <tr>
                   <td>入学年份:</td>
                   <td><input type="text" id="newsTime" name ="stuInfor.stuStartTime" onFocus="WdatePicker()"/></td>
                <td>毕业年份:</td>
                <td><input type="text" id="newsTime" name ="stuInfor.stuEndTime" onFocus="WdatePicker()"/></td>
               </tr>
               <tr>
                   <td>工作省市:</td>
                   <td><input type = "text" name = "stuInfor.stuWorkAddress" id = "stu_name"><font color = "red">&nbsp;&nbsp;*省+市[如浙江杭州]</td>
                <td>工作单位:</td>
                <td><input type = "text" name = "stuInfor.stuWorkPlace" id = "stu_name"></td>
               </tr>
               <tr>
                   <td>工作岗位:</td>
                   <td><input type = "text" name = "stuInfor.stuWorkPost" id = "stu_name"></td>
                <td>职务职称:</td>
                <td><input type = "text" name = "stuInfor.stuWorkZc" id = "stu_name"></td>
               </tr>
               <tr>
                   <td>办公电话:</td>
                   <td><input type = "text" name = "stuInfor.stuPhone" id = "stu_name"></td>
                <td>手机号码:</td>
                <td><input type = "text" name = "stuInfor.stuTelephone" id = "stu_name"></td>
               </tr>
                   <tr>
                   <td>QQ号码:</td>
                   <td><input type = "text" name = "stuInfor.stuQq" id = "stu_name"></td>
                <td>电子邮箱:</td>
                <td><input type = "text" name = "stuInfor.stuEmail" id = "stu_name"></td>
               </tr>
               <tr>
                   <td>通信地址：</td>
                   <td><input type = "text" name = "stuInfor.stuCommAddress" id = "stu_name"></td>
                <td>家庭地址:</td>
                <td><input type = "text" name = "stuInfor.stuAddress" id = "stu_name"></td>
               </tr>
               <tr>
                   <td>头像上传：</td>
                   <td><input type = "file" name = "upload" id = "upload"></td>
               </tr>
</table>
<input type = "submit" name = "test" value = "确定存储">
<input type = "button" name = "test" value = "返回列表" onclick = "showAddBatchSub(0, 'inforListAction.action');">
</form>

调用到的js：

function checkAdd(form){
    var options = { 
            dataType: 'json',
            success: inforAddResponse 
    };
    $("#inforAddForm").ajaxSubmit(options); 
    return false;
}
//回调
function inforAddResponse(responseText){
  alert(responseText.msg);
}

后台的操作时一样的