類似省市級聯的級聯選擇,乙個請求搞定

2021-10-12 08:47:43 字數 3043 閱讀 9360

最近朋友遇到乙個需求:要做類似省市級聯的乙個東西,通過使用者選擇的年級,動態顯示對應的班級

年級的選項不是寫死的,而是由後台傳過來的資料動態顯示的

即頁面中的兩個下拉框:年級、班級,的選項均由資料庫提供,且班級的選項還受使用者已選擇的年級選項的影響

年級和班級在同一張表中

id年級id

年級班級id班級1

1小學一年級

991一班21

小學一年級

992二班32

小學二年級

991一班43

小學三年級

991一班53

小學三年級

991一班

肉眼可見,共5條資料

第4、5條資料,由於人員疏忽,造成資料重複

表中資料表示:一年級有兩個班,二年級和三年級各有乙個班

我朋友和我一開始想到乙個很容易想到的辦法:

前端請求兩次

對年級字段進行去重(distinct)操作,得到三條資料

根據前端使用者選擇的年級,作為條件,查詢班級字段,且去重(distinct)

即達到了需求,又去掉了重複的資料

而且,因為年級是使用者動態選擇的,在使用者選擇之前,你都不知道是哪個年級,這麼回顯對應的班級?

所以絕對是需要兩次請求!(接下來就開始打臉 tat)

兩次請求會增加伺服器壓力,能少傳送請求就盡量少

思想也很簡單(我不覺得),就是將所有資料都返給前端

前端先從資料中取出所有年級,顯示給使用者。等使用者選擇完,再根據選擇的年級去那一堆資料裡摘出對應的班級進行顯示

所以,兩次請求對前端來說是友好的(前端哭暈在廁所)

查詢表,將年級和班級都查出來

select 年級id, 年級, 班級id, 班級

from 表 group

by 年級id,班級id;

在查詢的同時,利用分組進行去重(至於為什麼要用group by,而不用distinct,可以去看:sql去重語句【distinct】和【group by】究竟用哪個?

定義實體類接收

查詢是查詢出來了,但是絲毫沒有處理的資料,就算是前端大佬來,也不願意處理啊

所以實體類不能單純的寫:

integer 年級id, string 年級, integer 班級id, string 班級

為了做到乙個實體類,完成後續資料處理操作,故這樣設計:

public

class

basic

在查詢時,年級id和年級名都賦值給了id 和 name,班級id和班級名則賦值給tt.id,tt.name

這樣操作,剛查出來的資料list< basic >是這樣的:

[

basic:id

: 1;

name

: 小學一年級;

tt:[id

: 991;

name

: 一班;

tt: null;

children

: null;

]children

: null;];[

basic:id

: 1;

name

: 小學一年級;

tt:[id

: 992;

name

: 二班;

tt: null;

children

: null;

]children

: null;];[

basic:id

: 2;

name

: 小學二年級;

tt:[id

: 991;

name

: 一班;

tt: null;

children

: null;

]children

: null;];[

basic:id

: 3;

name

: 小學三年級;

tt:[id

: 991;

name

: 一班;

tt: null;

children

: null;

]children

: null;

];

處理資料

資料還需要進一步處理,以便前端可以更好的摘需要的資料

對於所有 id和name相同的 basic資料,將其tt屬性放到乙個children中

也就是,將上述資料合併成乙個basic就能表示整個年級的所有班級

例如:

[

basic:id

: 1;

name

: 小學一年級;

tt: null;

children:[

[basic:id

: 991; name: 一班; tt: null; children: null;],[

basic:id

: 992; name: 二班; tt: null; children: null;]]]

,[basic:id

: 2;

name

: 小學二年級;

tt: null;

children:[

[basic:id

: 991; name: 一班; tt: null; children: null;]]]

,[basic:id

: 3;

name

: 小學三年級;

tt: null;

children:[

[basic:id

: 991; name: 一班; tt: null; children: null;]

]]

這種情況需要前端配合,所以還是要做好兩手準備,萬一前端用的技術不能夠分離上述資料,還是得用兩次請

動態的省市級聯

aligins none block 所屬地區 請選擇 請選擇 請選擇 請選擇 請選擇 先查一級 public listfindonearea long parentid 再查二級 public listfindchildsarea long id 實體類 private static final ...

例項059 Map對映集合實現省市級聯選擇框

心法領悟059 掌握各種map集合。map集合的具體實現有很多,應該根據需要來選擇。其中hashmap是最常用的對映集合,它只允許一條記錄的鍵為null,但是卻不限制集合中值為null的數量。hashtable實現了乙個對映,它不允許任何鍵值為空,treemap集合將對集合中的鍵值排序,預設排序方式...

剛用seam做了乙個級聯下拉列表的例子

最近學習seam,做了乙個小例子 以前做專案一聽到級聯下拉列表就頭疼,現在有了ajax問題就好解決了,現在我用seam來表演一下它是怎樣解決問題的,同時也為剛入門的朋友提供一些捷徑,拋磚引玉,大家互相學習。希望你先從seam reference了解了什麼是seam gen,然後就可以開始我們的 生成...