Hey guys!! I guess this problem is kind of old. I looked up for it a lot but i am just not a programming genius and couldn't get it to work.. or did not know how to do it for my case.
I have page that has lots of articles. I created some filters for the user like brand, max price, min price, sort and stuff like that. it looks like this
-article - article - article- -article - article - article- -article - article - article-
What i want is that when the user changes a filter the section with the articles automaticly reloads with the articles that match. I also don't want the user to press a submitbutton, but thats not the problem for now :D For now i would like to know how to pass the filter-data to my controller, get the articles and give them to the view without reloading the whole page.
BTW i am using Laravel 4.0. Earlier i used 4.2 but the sessions just didn't work for some reason so i used the good old 4.0 ^^
I will show you my current code
routes.php
Route::any('alle-schuhe', ['as' => 'alleschuhe', 'uses' => 'PageController@alleSchuhe']);
I would like to check if its post or get in the Controller.
PageController.php
class PageController extends \BaseController {
public function alleSchuhe() {
$data = Helpers::getArticleData();
$view = View::make('alleschuhe', [
'page' => 'Alle Schuhe',
'articleList' => $data['articleList'],
'allBrands' => $data['allBrands'],
'brand' => $data['brand'],
'special' => $data['special'],
'sort' => $data['sort'],
'price_min' => $data['price_min'],
'price_max' => $data['price_max']
]);
return $view;
}
}
Helpers::getArticleData(); is giving me all the data for the matching articles. It checks if there comes new filter data per POST. If yes it writes it in SESSION and gives it to a QueryBuilder. If there is no POST data it looks if there is filter-data in the SESSION. If not it just takes default values (brands= all, min-price=0 etc)
So when the user is changing the filter i need to run Helpers::getArticleData() again, give that data to the view and reload just the section with the articles. Well for now the filters and articles are in the same section but i could change this
Here is my view
@extends('layout.main') @section('content1')
{{Form::open(['url' => 'alle-schuhe'])}}
<section class="filter">
<h4>Marke</h4>
<select name="brand" data-width="200px">
<option value="alle" <?php if ($brand == "alle") echo "selected=\"selected\""; ?> >Alle</option>
@foreach($allBrands as $singlebrand)
<option value="{{$singlebrand->brandname}}" <?php if ($brand == "{$singlebrand->brandname}") echo "selected=\"selected\""; ?>>{{$singlebrand->brandname}}</option>
@endforeach
</select>
<h4>Sortieren nach</h4>
<select name="sort">
<option value="top" <?php if ($sort == "top") echo "selected=\"selected\""; ?> >Beliebteste</option>
<option value="price_up" <?php if ($sort == "price_up") echo "selected=\"selected\""; ?> >Preis aufsteigend</option>
<option value="price_down" <?php if ($sort == "price_down") echo "selected=\"selected\""; ?> >Preis absteigend</option>
</select>
<input type='submit' value='Sortieren' name='submit' class='btn btn-green'/>
{{Form::close()}}
@if(sizeof($articleList) > 0)
<div class="tiles-wrapper">
@foreach($articleList as $articles)
{{$articles->name}}
@endforeach
{{$articleList->links()}}
@else
<p class="bg-warning">No articles/p>
@endif
Please notice that i reduced the codes to the important stuff. For now i know i would have to preventDefault the form.. For the rest i actially have no idea :D
I hope you guys will take some time and take a look at it. Wish i could do it by myself :/ Thanks for your time!!!! :) Regards, gerti
I sort of had a similar problem and this is how I solved it. It's not exactly what you have but maybe if it's explained in a Laravel 4 style you can apply it to your project.
What you will need to do is have jquery to take advantage of this.
OK, this is the form part of this. What this is basically going to do is..when I user starts typing in a name its automatically going to search the database for anything related to what they are typing and return that into a table.
{{ Form::text('date','', array('class' => 'datepicker', 'onChange' => 'postdata(this.value);')) }}
Then at the bottom of the blade template open a script tag and add the postdata function,
<script>
function postdata(data) {
$.post("{{ URL::to('book/postdate') }}", { input:data }, function(returned){
$('.book').html(returned);
});
}
</script>
What that is basically doing is its using blade to input the url to the call we are wanting to make. In this case the book/postdata url and it's going to insert it into the book class that's also on the blade page (an a empty div). It is actually probably better to just call a controller but whichever is best.
Controller
public function postDate() {
$date = Input::get('input');
$schedule = DB::table('bk_schedule')
->select( DB::raw('bk_schedule.note, bk_schedule.office_note, bk_schedule.office, pr_service.short_name, bk_timeslot.block, bk_schedule.date, bk_status.status, users_information.last_name, users_information.street_1, users_information.phone_1, users_information.user_zip_code, users_information.street_2, users_information.phone_2, users_information.apartment, bk_schedule.userID, bk_schedule.id, group_concat(pr_service.service)as service_detail, group_concat(pr_service.short_name)as group_service '))
->join('bk_service', 'bk_schedule.id', '=', 'bk_service.bk_id')
->join('users_information', 'bk_schedule.userID', '=', 'users_information.id')
->join('bk_status', 'bk_schedule.status', '=', 'bk_status.id')
->join('bk_timeslot', 'bk_schedule.block', '=', 'bk_timeslot.id')
->join('pr_service', 'bk_service.services', '=', 'pr_service.id')
->where('bk_schedule.date', $dateFormat)
->whereIn('bk_schedule.status', array('1', '6'))
->groupBy('bk_service.userID', 'bk_service.bk_id')
->orderBy('bk_schedule.office', 'asc')
->get();
return View::make('ajax.date', array('schedule' => $schedule));
}
Route
Route::post('book/postdate', 'BookController@postDate');
So, from here you can probably see how you can know use just straight laravel to do everything you need. I chose to create an ajax.date blade template so when the book class is loaded it will load that template inside that class to display a table. You might just want to return back to that page.
I hope that helps at least guide you into the right direction. If that doesn't help look at the laravel docs for JSON and that might help you also!
Good luck!
I have an application in which I have to filter data based on the item selected from the select box. Can I display data without form reload? I have included jquery.
Controller to initial page load.
public function listCampaign()
{
$list1s = List1::orderBy('id', 'desc')->get();
$this->layout->title = "Listing Campaigns";
$this->layout->main = View::make('dash')->nest('content', 'campaigns.list', compact('list1s'));
$campaigns = Campaign::orderBy('id', 'desc')->where('user_id','=',Auth::user()->id)->paginate(10);
Session::put('slist', $list1s);
View::share('campaigns', $campaigns);
}
Here I share list1s and campaigns to the view (it is working properly).
My Blade is list.blade.php
<h2 class="comment-listings">Campaign listings</h2><hr>
<script data-require="jquery@2.1.1" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<thead>
<tr>
<th>Select a List:</th>
<th>
<form method="post">
<select class="form-control input" name="list1s" id="list1s" onchange="postdata(this.value)" >
<option selected disabled>Please select one option</option>
@foreach($list1s as $list1)
<option value="{{$list1->id}}">{{$list1->name}}</option>
@endforeach
</select>
</form>
</th>
</tr>
</thead>
</table>
<table>
<thead>
<tr>
<th>Campaign title</th>
<th>Status</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
<div id="campaign">
@foreach($campaigns as $campaign)
<tr>
<td>{{{$campaign->template->title}}}</td>
<td>
{{Form::open(['route'=>['campaign.update',$campaign->id]])}}
{{Form::select('status',['yes'=>'Running','no'=>'Stoped'],$campaign->running,['style'=>'margin-bottom:0','onchange'=>'submit()'])}}
{{Form::close()}}
</td>
<td>{{HTML::linkRoute('campaign.delete','Delete',$campaign->id)}} </td>
</tr>
@endforeach
</div>
</tbody>
</table>
<script>
function postdata(data) {
$.post("{{ URL::to('campaigns/get') }}", { input:data }, function(returned){
$('.campaign').html(returned);
});
}
</script>
{{$campaigns->links()}}
On select change, URL campaigns/get is invoked.
Controller for the URL is given below
public function getCampaigns()
{
$list1 = Input::get('input');
$campaigns = Campaign::where('list1_id','=', $list1)->paginate(10);
return View::make('campaigns.list', compact('campaigns'));
}
Here POST http://localhost/lemmeknw/public/campaigns/get is passed but no change comes on the view, it is showing 404 error in browser console.
Am I completely wrong? Any solutions?
Sign in to participate in this thread!
The Laravel portal for problem solving, knowledge sharing and community building.
The community