1. 程式人生 > >ajax+Jquery 封裝+跳轉

ajax+Jquery 封裝+跳轉

第一: 表格

<table>

<tr align="center">

<td><input type="text"  name="userID"class="userID"   value="${user.userID}"   ></td>
<td><input type="text"name="userName"class="userName" value="${user.userName}" ></td>
<td><input type="text" name="userCode" class="userCode" value="${user.userCode
}" ></td>
<td>
         <c:forEach items="${menusList}" var="menu">

   <span style="width: 25%"> ${menu.menu_name}&nbsp;&nbsp;

             <input type="checkbox" name="menu_code" class="menu_code" value="${menu.menu_code}"  >

           </span>

        </c:forEach>
</td>
 <td>
  <c:forEach items="${privilegeList}
" var="privilege">

<span style="width: 25%"> ${privilege.preName}

                   <input type="checkbox"  name="pricode" class="pricode" value="${privilege.pricode}"  >

               </span>

  </c:forEach>
 </td>
 </tr>
     <tr align="center">
<td colspan="3"><input type="button" value="新增英雄霸業"  class="addNew"></td>
<td colspan="2"><input type="button" value="返回首頁"     onclick="BACK()"></td>

</tr>

</ table>

第二: Jquery 點選觸發函式

$(document).ready(function(){ 
//新增:  
$(".addNew").click(function() {
//選單集合:
var menu_codeList = "";
    $('input:checkbox[name=menu_code]:checked').each(function(i){
      if(0==i){
      menu_codeList = $(this).val();
    }else{
      menu_codeList += (","+$(this).val());
    }
  });
    
    //許可權集合:
    var pricodeList = "";
    $('input:checkbox[name=pricode]:checked').each(function(i){
      if(0==i){
    pricodeList = $(this).val();
    }else{
    pricodeList += (","+$(this).val());
    }
  });
  
var userID = $(".userID").val();                                    // 取對應元件的值

var userCode = $(".userCode").val();

if(userID!= null){
   var formData = new FormData();
   formData.append('userID', userID);
formData.append('userCode', userCode);                  // “userCode” -- 對應 Controller 中的引數,保持一致
formData.append('menu_codeList', menu_codeList);
formData.append('pricodeList', pricodeList);

$.ajax({
url : "/user/ump/addUserDoMenuPrivilege.action",       //工程名稱+ Controller 路徑

type : "POST",

data : formData,                                                    //物件 formData 儲存資料

dataType: "json",

processData : false,

contentType : false,

success : function(data) {
alert("新增霸業成功");              //返回成功後繼續跳轉
window.location.href="${pageContext.request.contextPath}/ump/findUserMenuPrivilege.action?userID="+userID;
},
error : function(data) {
alert("新增霸業失敗");
}
     });
}
});

});

相關推薦

ajax+Jquery 封裝+

第一: 表格<table><tr align="center"><td><input type="text"  name="userID"class="userID"   value="${user.userID}"   >&l

JQueryAjax 的重頁面

  //由於封裝之後的ajax,返回 從資料庫得到的資料 ,此時想在這個地方完成頁面的跳轉將不支援,可以通過下面的方法(頁面的JS)間接完成需要跳轉的頁面 <script> $(".deleteSection").click(function(){   let con

jquery頁面導航變色,刷新後依然存在

ctu contacts new each menu [0 oca function == jquery代碼: <script> $(document).ready(function () { //$(".me

tp5 js傳參;thinkphp5 js傳參;thinkphp5 ajax返回引數

有的時候我們傳送ajax請求到後臺,然後返回一個動態的引數到url做跳轉,因為tp有專門的路由,直接將js帶入到tp路由去生成顯然不現實,這個時候只需要迂迴一下,先用tp自帶路由生成一個連線,然後再用js去替換即可 demo: $.post('{:url("home/me

jQuery後頁面的導航欄新增選中後樣式

感覺這個功能還是比較常用的,當頁面載入後,預設的導航欄子項有一個類,當其他子項點選時,移除之前標籤所新增類,給當前標籤加上類,程式碼如下 <script> $(document).read

使用AJAX實現頁面

$.ajax({ type:"POST", url: //你的請求程式頁面隨便啦 async:false,//同步:意思是當有返回值以後才會進行後面的js程式。 dat

jquery實現到頁面指定位置

方法1: var t = $('#accountListDiv').offset().top;//  獲取需要跳轉到標籤的top值 $(window).scrollTop(t);// 跳轉到指定位置

Ajax post請求頁面

最近因為公司需求,需要ajax post請求並跳轉介面,網上搜了一下資料,差不多都是用window.location.href來處理,但是在請求頁面的位址列中會暴露請求的引數,這是不安全的。 $.post( url, {method:"regist",use

Ajax Session失效登入頁面的方法

在Struts應用中,我們發出的請求都會經過 相應的攔截器進行相關處理,一般都會有一個使用者登入攔截(Session失效攔截);一般請求的話,如果Session失效時,我們會跳到登入頁面,可是如果我們採用AJAX請求時,將會返回登入頁面的HTML程式碼,這肯定不是我們想要的,

servlet的後臺頁面ajax的頁面

1.servlet的頁面跳轉 Servlet:當然,在servlet中,一般跳轉都發生在doGet, doPost等方法裡面。1) redirect 方式response.sendRedirect("/a.jsp");頁面的路徑是相對路徑。sendRedirect可以將頁面

#.Jquery實現到servlet

                         $(function() {                                 $("#btn").click(function(

jquery ajax中success中的問題

http://www.cnblogs.com/horsen/p/6933038.html注意起來一個情況:ajax+submit+同步----就是你用ajax請求伺服器,而且用的是同步的方式,並且你是通過點選了type型別為submit的按鈕來觸發這個ajax。這個時候,首

jQuery ajax傳送POST、JS url、console用法

總結JS常用方法,以備以後使用 $.post("URL1",{userName: userName, password: password }, function(data) {

thinkphp前臺使用JQuery後臺處理後回調

res 列表 首頁 || logs else foreach 進行 信息 thinkphp前臺使用JQuery跳轉後臺處理後回調記錄。 前臺html <input id="query" type="tel" value="" placeholder="搜索編號查詢"

一些理解-過濾器,攔截器,ajax提交後不,document.location.href無效,回調函數。

客戶 發送 觀察 要去 jaxb 源碼 流程 type類 攔截器的工作流程 1.struts2中過濾器和攔截器的工作流程: request-->執行自定義過濾器doFilter方法中的chain.doFilter()方法前的代碼-->執行默認過濾器doFilte

jquery.pagination.js添加

ntp reat urn -c css nts llb eric borde 原作者github地址:https://github.com/gbirke/jquery_pagination 在這基礎上加入了跳轉到指定頁。 修改後的jquery.pagination.js

雜記-格式化Date默認格式,日期加一天,jstl判斷字符類型,ajax模擬from表單後臺頁面,jstl訪問數據庫並在頁面顯示

lena span 格式 edr app msu 顯示 頁面 clas 1.格式化Date默認格式      String str="Sun Oct 08 22:36:45 CST 2017"; SimpleDateFormat sdf = new Sim

JQuery 實現 錨點

ani 點擊 內部 jquer 平滑 attr href ima bsp $(‘.nav-jump‘).click(function() { $(‘html,body‘).animate( { sc

jQuery使用ajaxSubmit()提交表單(在不希望頁面的情況下)

ont .ajax 引入 當前 data fun get orm mit 原文:http://www.jb51.net/article/48728.htm ajaxSubmit(obj)方法是jQuery的一個插件jquery.form.js裏面的方法,所以使用此方法需要先

<jQuery> <方法> 十八. 移除事件, 觸發事件, 事件對象(阻止冒泡, 阻止)

value func bsp 方法 function 事件 opp put baidu <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">