關於如何用jquery的ajax來實現資料的互動
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">發現網上有很多關於如何使用jquery的ajax來實現資料的傳送,但是都很不具體,正好有個專案用到,和大家分享一下關於ajax的使用</span>
簡單描述一下,在前面的jsp頁面的script裡面寫ajax,並且傳送資料到struts的action中,並且在action裡面實現資料的查詢,將查詢的資料放在一個list裡面,再把list封裝成json物件,然後在讓前臺頁面進行接收,將接收的資料在jsp頁面進行顯示,將資料放在一個table之中;
首先是要匯入的js
jquery-1.7.2.js
function selectValue() { with (document.myForm) { var deptx = dept.value; var majorx = major.value; var varUrl = "${ pageContext.request.contextPath }/message/get";//(get是一個action struts裡面的) $ .ajax({ type : "get", url : varUrl, cache : false, data : "dept=" + deptx + "&major=" + majorx,//(這裡的變數可以修改) dataType : 'json', success : function(json) { var strGetCourse = "";
<span style="white-space:pre"> </span>//將資料以每行6個的形式顯示 strGetCourse = strGetCourse + "<table border=1px class='row'>"; for (var i = 0; i < json.length; i++) { if (i % 6 == 0) { strGetCourse = strGetCourse + "<tr>"; } strGetCourse = strGetCourse + "<td><input type='checkbox' name='sel_course' value='" + json[i].name + "'>" + json[i].name + "</input></td>"; if (i % 6 == 0 && i != 0) { strGetCourse = strGetCourse + "</tr>"; } } strGetCourse = strGetCourse + "</table>"; alert(strGetCourse); course_learned.innerHTML = strGetCourse;//將table放在一個名為<span style="font-family: Arial, Helvetica, sans-serif;">course_learned的div裡面</span> }, error : function(text) { alert("對不起,使用者ID不存在,請輸入正確的使用者ID"); } }); } }
接下來是struts的配置檔案
<package name="message" namespace="/message" extends="json-default">
<action name="get" class="stu.action.MessageAction" >
<result type="json">
<param name="root">list</param>
</result>
</action>
</package>
然後是MessageAction這是一個java類
public String execute() throws Exception {
list=new ArrayList();
major = new String( major.getBytes("iso8859-1"),"utf-8");
System.out.println(major);
Connection conn=null;
PreparedStatement psmt=null;
ResultSet rs;
String sql="select Course,Course_id from stu_course where major=?";
try {
conn=getConnection.getConnection();
psmt=conn.prepareStatement(sql);
psmt.setString(1, major);
rs=psmt.executeQuery();
while(rs.next()){
Course course=new Course();
course.setCourseid(rs.getString("Course_id"));
course.setName(rs.getString("Course"));
list.add(course);
}
System.out.println(list.size());
} catch (SQLException e) {
e.printStackTrace();
} catch (ClassNotFoundException e) {
e.printStackTrace();
}
finally{
if (conn!=null) {
try {
conn.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
}
return Action.SUCCESS;
}
裡面還涉及到一些類的封裝,對整個程式碼的理解沒多大關係,就不上傳了,希望幫助大家理解
相關推薦
怎麼理解用程式碼來實現資料結構
怎麼能更好的用程式碼實現資料結構內容? 個人理解為:1.首先要掌握資料結構的邏輯,也就是說要知道資料結構是怎麼實現的。這一點達不到的話,後面根本就無從談起。 &nbs
用axios來實現資料請求
cdn載入 <script src="https://unpkg.com/axios/dist/axios.min.js"> </script> get請求 axios.get('/detail?id=10').then(function (r
用AsyncTask來實現非同步請求網路資料
public class HelperAsnc { public HelperAsnc(){} //get請求 public HelperAsnc get(String url){ doHttp(url,"GET",""); retu
用js來實現那些資料結構14(樹02-AVL樹)
在使用二叉搜尋樹的時候會出現 一個問題,就是樹的一條分支會有很多層,而其他的分支卻只有幾層,就像下面這樣: 如果資料量夠大,那麼我們在某條邊上進行增刪改查的操作時,就會消耗大量的時間。我們花費精力去構造一個可以提高效率的結構,反而事與願違。這不是我們想要的。所以,我們需要另
關於如何用jquery的ajax來實現資料的互動
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">發現網上有很多關於如何使用jquery的ajax來實現資料的傳送,但是都
資料結構課程設計---------用棧來實現表示式求值
1、需求分析 設計一個程式,演示用算符優先法對算術表示式求值的過程。利用算符優先關係,實現對算術四則混合運算表示式的求值。 (1)輸入的形式:表示式,例如2*(3+4) 包含的運算子只能有'+' 、'-' 、'*' 、'/' 、'('、 ')'; (2)輸出的形式
用Jquery來實現點擊事件等的功能
點擊事件 image alt logs ima log ges query images 用Jquery來實現點擊事件等的功能
用openpyxl來實現99乘法表
python openpyxl openpyxl作為excel眾多的一員,具有簡單易用,功能廣泛的特點。環境: win 10 python 3.6 pip 9.0.1 openpyxl 2.4.8安裝openpyxl 打開cmd命令行,輸入pip install
[LeetCode] 232. Implement Queue using Stacks 用棧來實現隊列
logs not IT pty HA 實現 AC ted .cn Implement the following operations of a queue using stacks. push(x) -- Push element x to the back of
用js來實現那些數據結構(數組篇01)
指定 賦值 重要 原始類型 delete 號稱 如果 開發 實現原理 在開始正式的內容之前,不得不說說js中的數據類型和數據結構,以及一些比較容易讓人混淆的概念。那麽為什麽要從數組說起?數組在js中是最常見的內存數據結構,數組數據結構在js中擁有很多的方法,很多初學者
232 Implement Queue using Stacks 用棧來實現隊列
whether light 操作 move bool problem rem http rip 使用棧來實現隊列的如下操作: push(x) -- 將一個元素放入隊列的尾部。pop() -- 從隊列首部移除元素。peek() -- 返回隊列首部的元素。empty() --
用js來實現那些數據結構10(集合02-集合的操作)
交集 學習 href targe 更改 分類 擁有 ren log 前一篇文章我們一起實現了自定義的set集合類。那麽這一篇我們來給set類增加一些操作方法。那麽在開始之前,還是有必要解釋一下集合的操作有哪些。便於我們更快速的理解代碼。 1、並集:對於給定的兩個集合
用js來實現那些數據結構11(字典)
完成 str function .get 自己的 items 結構 AR pre 我們這篇文章來說說Map這種數據結構如何用js來實現,其實它和集合(Set)極為類似,只不過Map是【鍵,值】的形式存儲元素,通過鍵來查詢值,Map用於保存具有映射關系的數據,Map裏保存
用js來實現那些數據結構14(樹02-AVL樹)
PE 有一個 解決 講解 html 16px var map 操作 在使用二叉搜索樹的時候會出現 一個問題,就是樹的一條分支會有很多層,而其他的分支卻只有幾層,就像下面這樣: 如果數據量夠大,那麽我們在某條邊上進行增刪改查的操作時,就會消耗大量的時間。我們花費精力
用js來實現那些數據結構15(圖01)
ice ring repeat fan lB tool ati ges lba 其實在上一篇介紹樹結構的時候,已經有了一些算法的相關內容介入。而在圖這種數據結構下,會有更多有關圖的算法,比如廣度優先搜索,深度優先搜索最短路徑算法等等。這是我們要介紹的最後一個數據結構。同時也
用Vue來實現音樂播放器(十六):滾動列表的實現
com 作用 efault nor 大小 -s stylus BE ack 滾動列表是一個基礎組件 他是基於scroll組件實現的 在base文件夾下面創建一個list-view文件夾 裏面有list-view.vue組件 <template>
用Vue來實現音樂播放器(十八):右側快速入口點擊高亮
為我 UC 沒有 short cut this 必須 左右 png 問題一:當我們點擊右側快速入口的時候 被點擊的地方高亮 首先我們要知道右側快速入口是為什麽高亮??因為當watch()監控到scrollY的變化了的時候 將scrollY的值和listHeight相比較
用Vue來實現音樂播放器(八):自動輪播圖啊
-s AR better hold ons ntp next start upd slider.vue組件的模板部分 <template> <div class="slider" ref="slider"> <div class=
用Vue來實現音樂播放器(九):歌單數據接口分析
QQ 插件 但是 之間 nbsp 跨域問題 前端 代理服務 一點 z這裏如果我們和之前獲取輪播圖的數據一樣來獲取表單的數據 發現根本獲取不到 原因是qq音樂在請求頭裏面加了authority和refer等 但是如果我們通過jsonp實現跨域
用Vue來實現音樂播放器(三十八):歌詞滾動列表的問題
vue 三十八 pla -s toggle 情況 TP 解決辦法 暫停 1、頻繁切換歌曲時,歌詞會跳來跳去 原因: // 歌詞跳躍是因為內部有一個currentLyric對像內部有一些功能來完成歌詞的跳躍 //每個currentLyric能實現歌曲的播放跳到相應的位置 是