摘要:前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。例如條件全部為空即顯示所有模式為全部范圍,分類和價(jià)格多帶帶指定。
前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。之前從沒(méi)做過(guò),查了不少資料,總算實(shí)現(xiàn)了。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。菜鳥(niǎo)有一顆成為大神的心。在這里分享給各位童鞋,歡迎大佬指導(dǎo)一下。
先說(shuō)下原理:php實(shí)現(xiàn)多級(jí)篩選主要是利用a鏈接get傳參,把每個(gè)標(biāo)簽包含的參數(shù)通過(guò)a鏈接傳到后臺(tái)控制器,控制器接收參數(shù)后接著再把值賦回給模板,并且根據(jù)參數(shù)查詢對(duì)應(yīng)數(shù)據(jù)輸出給前臺(tái)。實(shí)現(xiàn)起來(lái)也不難,講到這里,感覺(jué)剛開(kāi)始自己完全沒(méi)有思路的樣子真是該打,哈哈...
下面是前臺(tái)代碼示例:
類型: 0, "mode" => $a, "price"=>$c])}">全部 1, "mode" => $a, "price"=>$c])}">官方新聞 2, "mode" => $a, "price"=>$c])}">移動(dòng)應(yīng)用 3, "mode" => $a, "price"=>$c])}">微信公眾號(hào) 4, "mode" => $a, "price"=>$c])}">Android開(kāi)發(fā) 模式: $b, "mode" => "0", "price"=>$c])}">全部 $b, "mode" => "1", "price"=>$c])}">模式1 $b, "mode" => "2", "price"=>$c])}">模式2 $b, "mode" => "3", "price"=>$c])}">模式3 $b, "mode" => "4", "price"=>$c])}">模式4 $b, "mode" => "5", "price"=>$c])}">模式5 $b, "mode" => "6", "price"=>$c])}">模式6 預(yù)算價(jià)格: $b, "mode" => $a, "price"=>"0"])}">全部 $b, "mode" => $a, "price"=>"1"])}">600以下 $b, "mode" => $a, "price"=>"600"])}">600-1000 $b, "mode" => $a, "price"=>"1000"])}">1000-5000 $b, "mode" => $a, "price"=>"5000"])}">5000以上
這段代碼大家肯定都能看懂,我再啰嗦一下,比如當(dāng)用戶第一下點(diǎn)擊類型里面的全部的時(shí)候,便會(huì)把category字段為0傳到后臺(tái)。后臺(tái)接收判斷并把值再賦回給前臺(tái),如果category字段值為0,則查詢?nèi)康姆诸悢?shù)據(jù)。如果用戶第二下點(diǎn)擊模式里面的全部,那此時(shí)因?yàn)閏ategory的值是由后臺(tái)賦值過(guò)來(lái)的所以為0,mode為0。如果第三下點(diǎn)擊價(jià)格里的全部,則三個(gè)標(biāo)簽值全部為0。此時(shí)后臺(tái)判斷條件,如果全部為0,則全部查詢,模板遍歷顯示。舉一反三,其他標(biāo)簽也是一樣。實(shí)際操作中,肯定不會(huì)把值一個(gè)一個(gè)寫(xiě)在標(biāo)簽里這么傻,只要用volist遍歷出來(lái)取值就可以了。大家都懂得哈。
因?yàn)槭嵌嗉?jí)篩選,所以where方法條件肯定不止一個(gè),所以要拼接where方法的值,我是個(gè)TPer,用TP5的方法舉例:
$b = input("category");//接收的分類id
$a = input("mode"); //接收的模式id
$c = input("price"); //接收的價(jià)格范圍值
$where = ["category"=>$category,"mode"=>$mode,"price"=>$price];//拼接where條件
$data = model("表名")->where($where)->select(); //查詢數(shù)據(jù)
return $this->fetch("",[
"data"=>$data,
"c"=>$c,
"b"=>$b,
"a"=>$a
]); //模板賦值
當(dāng)然,實(shí)際的情況肯定要設(shè)條件判斷三個(gè)值的數(shù)據(jù)的,根據(jù)值的情況設(shè)定where條件。例如:
if ($a == 0 && $b == 0 && $c == 0) {//條件全部為空,即顯示所有 $where = ""; } elseif ($a == 0 && $b != 0 && $c != 0) {//模式為全部范圍,分類和價(jià)格多帶帶指定。 $where = ["b"=>$b,"c"=>$c]; }
因?yàn)槲业拇a寫(xiě)的比較冗余,就不獻(xiàn)丑了哈...
最后實(shí)現(xiàn)的效果是這樣:
圖中的樣式可以在標(biāo)簽里判斷,如果頁(yè)面接收的參數(shù)值和當(dāng)前標(biāo)簽中的值相同,則給標(biāo)簽高亮樣式。至此,就是這樣,如果有同學(xué)有更好的思路,請(qǐng)不吝賜教。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/102308.html
摘要:前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。例如條件全部為空即顯示所有模式為全部范圍,分類和價(jià)格單獨(dú)指定。 前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。之前從沒(méi)做過(guò),查了不少資料,總算實(shí)現(xiàn)了。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。菜鳥(niǎo)有一顆成為大神的心。在這里分享給各位童鞋,歡迎大佬指導(dǎo)一下。先說(shuō)下原理:...
摘要:前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。例如條件全部為空即顯示所有模式為全部范圍,分類和價(jià)格單獨(dú)指定。 前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。之前從沒(méi)做過(guò),查了不少資料,總算實(shí)現(xiàn)了。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。菜鳥(niǎo)有一顆成為大神的心。在這里分享給各位童鞋,歡迎大佬指導(dǎo)一下。先說(shuō)下原理:...
摘要:前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。例如條件全部為空即顯示所有模式為全部范圍,分類和價(jià)格單獨(dú)指定。 前幾天做項(xiàng)目時(shí),碰到個(gè)需求,商品多級(jí)分類篩選功能。之前從沒(méi)做過(guò),查了不少資料,總算實(shí)現(xiàn)了。雖然實(shí)現(xiàn)的不夠優(yōu)雅,但起碼能有效果,心里還是很高興的。菜鳥(niǎo)有一顆成為大神的心。在這里分享給各位童鞋,歡迎大佬指導(dǎo)一下。先說(shuō)下原理:...
摘要:最近后端的同事要我寫(xiě)一個(gè)購(gòu)物車,一開(kāi)始我用寫(xiě),但寫(xiě)著寫(xiě)著發(fā)現(xiàn)邏輯太混亂了,寫(xiě)不下去。所以我想著用來(lái)實(shí)現(xiàn)一個(gè)。但在購(gòu)物車中這樣的方法是不行的,單個(gè)商品的選中以及取消所執(zhí)行的邏輯有部分不同,所以我選擇將其拆分。 最近后端的同事要我寫(xiě)一個(gè)購(gòu)物車,一開(kāi)始我用jQuery寫(xiě),但寫(xiě)著寫(xiě)著發(fā)現(xiàn)邏輯太混亂了,寫(xiě)不下去。最后花了五分鐘找了個(gè)demo丟給了他。后來(lái)我不甘心,畢竟水平菜還不求上進(jìn)就完蛋了。所...
摘要:阿里云上傳文件第三節(jié)實(shí)現(xiàn)淘寶上傳商品圖片首先我們來(lái)看看淘寶的功能和樣式之后看看制作完成的演示由于全部功能弄成有點(diǎn)大限制上傳大小好像在之內(nèi)壓縮之后也有所以分為兩個(gè)演示圖片后端代碼基于第三個(gè)文章不變?nèi)サ羯蟼鬟M(jìn)度條去掉上傳提示重寫(xiě)重寫(xiě)前端代碼需要 **TP5+阿里云OSS上傳文件第三節(jié),實(shí)現(xiàn)淘寶上傳商品圖片首先我們來(lái)看看淘寶的功能和樣式:**showImg(https://segmentfa...
閱讀 1772·2021-10-11 10:57
閱讀 2356·2021-10-08 10:14
閱讀 3399·2019-08-29 17:26
閱讀 3356·2019-08-28 17:54
閱讀 3029·2019-08-26 13:38
閱讀 2903·2019-08-26 12:19
閱讀 3613·2019-08-23 18:05
閱讀 1282·2019-08-23 17:04