使用ul> li过滤数据

时间:2019-01-15 11:46:26

标签: javascript jquery laravel

我正在从数据库中获取数据,并尝试过滤这些数据。但是不使用selectBox尝试使用ul> li已经设置了控制器。

public function search(Request $request)
    {
        $q = $request->q;
        $sortbyprice = $request->sortbyprice;
        $region = $request->region;

        $paginationData = [
            'q' => $q
        ];

        $estates = \DB::table('allestates')
            ->where('lat', '!=', '')
            ->where('lng', '!=', '')
            ->where('price', '!=', '')
            ->where(function($query) use ($q) {
                $query->where("building_name", "LIKE", "%" . $q . "%")
                    ->orWhere("address", "LIKE", "%" . $q . "%")
                    ->orWhere("company_name", "LIKE", "%" . $q . "%")
                    ->orWhere("region", "LIKE", "%" . $q . "%");
            })
            ->when($sortbyprice, function($query, $order) use ($paginationData) {
                if(!in_array($order, ['asc','desc'])) {
                    $order = 'asc';
                }

                $paginationData['sortbyprice'] = $order;

                return $query->orderBy('price', $order);

            }, function($query) {
                return $query->orderBy('price');
            })
            ->when($region, function($query, $regionId) use ($paginationData) {
                $paginationData['region'] = $regionId;
                return $query->where('region', $regionId);
            })
            ->paginate(100);

        $paginationData = array_filter($paginationData);

        return view("home", compact('estates', 'q','paginationData'));
    }

我在刀片中创建了一个下拉菜单。但是我不太确定如何将值传递到菜单中。例如,当我单击“价格”时,它会自动对其进行过滤。或者,当我单击“巴黎”时,它将从数据库中获取巴黎。

ul
{
    font-family: Arial, Verdana;
    font-size: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

ul li
{
    display: block;
    position: relative;
    float: left;
}

li ul
{
    display: none;
}

ul li a 
{
    display: block;
    text-decoration: none;
    color: #ffffff;
    border-top: 1px solid #ffffff;
    padding: 5px 15px 5px 15px;
    background: #2C5463;
    margin-left: 1px;
    white-space: nowrap;
}

ul li a:hover 
{
    background: #617F8A;
}
li:hover ul 
{
    display: block;
    position: absolute;
}

li:hover li
{
    float: none;
    font-size: 11px;
}

li:hover a 
{
    background: #617F8A;
}

li:hover li a:hover 
{
    background: #95A9B1;
}
<ul id="menu">
      <li><a href="">Sort Cheapest</a></li>
      <li><a href="">City</a>
        <ul>
        <li><a href="">Paris</a></li>
        <li><a href="">Amsterdam</a></li>
        <li><a href="">New York</a></li>
        </ul>
      </li>
</ul>

如何将“ sortbyprice”和“ region”或诸如“ paris”之类的值传递到菜单中...

2 个答案:

答案 0 :(得分:0)

也许像这样 <li><a href="/search?region=amsterdam">Amsterdam</a></li>

答案 1 :(得分:0)

请使用此功能获取点击的数据:-

$(function(){
    $("#menu li ul li a").click(function(){
        var item = $(this).text();
        var searchfrom  = $(this).parent().parent().parent().text();
        window.location = APP_URL+"/search?q="+searchfrom+"="+item;

   });
});

How to Display Selected Item in Bootstrap Button Dropdown Title