Тёмный

Laravel + Vue.js Demo: Filter by Category/Price/Manufacturer 

Laravel Daily
Подписаться 142 тыс.
Просмотров 39 тыс.
50% 1

The idea given in one of the comments on a previous video, this time we're showing how to manipulate the data when dealing with multiple filters, a typical example for an e-shop.
Repo: github.com/LaravelDaily/Larav...
Related videos:
- Laravel Demo: Multi-Level Categories E-Shop Catalog • Laravel Demo: Multi-Le...
- jQuery vs Vue.js: Laravel Master-Detail Form • jQuery vs Vue.js: Lara...
Related links:
- Laravel withCount: laravel.com/docs/7.x/eloquent...
- Laravel Eloquent Scopes: laravel.com/docs/7.x/eloquent...
- - - - -
Try our Laravel QuickAdminPanel: bit.ly/quickadminpanel
Enroll in my Laravel courses: laraveldaily.teachable.com

Хобби

Опубликовано:

 

8 июн 2020

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 54   
@opahprincewill4103
@opahprincewill4103 4 года назад
i always find your tutorials very useful in my projects. in fact, i created a folder named "specials", where i put all the tutorials i downloaded from "Laravel Business", and i always go there for references. i have learned a lot from you. thank you very much because you are a great inspiration
@trewts
@trewts 4 года назад
This is cool! Always wondered how those filters are made. Thank you, Povilas!
@andrewaghoghovwia1948
@andrewaghoghovwia1948 4 года назад
I honestly think you're the most knowledgeable php/JavaScript programmer out there.. sometimes i skip your videos because I think they're much too high level for me...That said..you make amazing contents..I must admit.. and I finally realize I've been doing myself a huge disservice..thanks so much sir..you're appreciated
@badger1741
@badger1741 4 года назад
Nice to see new way of doing it, I needed to put those things into query param and let friends share links with filtered products. I did that by reloading the page the same way amazon does, but I'd like to see your approach, especially it was hard to decide how query param will look with all those nested categories when it has mutch more query params not related to filter 😁
@rahulhuilgol5928
@rahulhuilgol5928 3 года назад
Excellent instruction!! As always a great video, Povilas!
@ThomasschmidtTJS
@ThomasschmidtTJS 3 года назад
Great 'tutorial' and very helpful for my current project. A clean way of filtering without using any external packages (except for Vue). Had to make some adjustments in order to make filtering on products' relationships possible. Next step is bundling all filter requests into one, because I'm currently facing some api throttling issues.
@thesafaripictures3453
@thesafaripictures3453 3 года назад
i didn't understand why you omit the category of manufacturers and categories. great video sir.
@mahmoudayad3683
@mahmoudayad3683 4 года назад
i have learned a lot from you. thank you very much because you are a great
@aomo5293
@aomo5293 3 года назад
Very very useful, using withFilters it s a good idea, Thank you share; May ALLAH keeps you safe.
@hotdotcyber6719
@hotdotcyber6719 2 года назад
Great video, what may be the performance to the server when multiple users are doing the filtering at the same time? Or when you have many products and accessed by many clients. Is it recommended to use vue js in such case?
@clashoftroopers4545
@clashoftroopers4545 3 года назад
Can I give this video a double Like? You are the best.
@qAntBcn
@qAntBcn 4 года назад
Thank you for another useful video! You are great! But i wold like to know will this works well if i have thousands of categories and thousands of products in each one?
@nicola123ste
@nicola123ste 2 года назад
Hi there! What is the best way to update the url every time a filter is changed? so you can share the filtered result? The scope function is so super!
@YassineNDv
@YassineNDv 3 года назад
Great tutorial, however I usually use .filter in computed, and i use it to filter the big array by categories. less code less request. So my question, is it best to use your way to filter elements or a vue computed way ?
@sunnysk43
@sunnysk43 4 года назад
Thank you so much! Working actually on the same thing - this video was released at the right time! Absolutely amazing! Again, thank you so much! There's also one question which I was thinking of a long time and I don't really know how to do: What's the right way to limit the api to my application - I mean if someone's debugging my code, he can get a list of my products with just an easy api call... How do you prohibit that?
@PovilasKorop
@PovilasKorop 4 года назад
If your list of products are public on the website, what is wrong for someone to get them via API? But if you do want to restrict them, then add API Auth, like with Laravel Sanctum.
@pratibimbakhadka487
@pratibimbakhadka487 4 года назад
How can we make only internal api call and hide api data from user when they try to directly access from browser url
@mraffandyi
@mraffandyi 3 года назад
Sir, try to implement a product filter size, brand, with ajax, please help
@kelvezu1585
@kelvezu1585 4 года назад
Laravel Vue Daily
@dadomultimediamusic
@dadomultimediamusic 2 года назад
Thank you so much for sharing and teaching. I realized with Laravel Debug Bar that are implied many queries to get products, Categories, Price, Manufacturers, let´s pretend that we would like to get not just those parameters, also: Brands, Colors, ProductCondition, Subcategories. If it could be possible to reduce the amount of queries, like making just 1 request, with all the parameters implied, having some kind of foreach to get the list of every filter? Greetings. Thank you in advance.
@almirjgg
@almirjgg 4 года назад
where can i see the full tutorial?
@faheemlove37
@faheemlove37 3 года назад
Hello sir, hope you are fine..i need help regarding checkboxes in laravel vue js...i am able to storing the values of checkbox but when i load value from template and then try to save, its not working with v-model...i used the computed property to get checked the checboxes from template by click on load from template. kindly make some video in which we can learn to store checkboxes to database and also can load the values of checkboxes from template and then also store that values again to the database from same component
@aminedaimallah310
@aminedaimallah310 4 года назад
nice tutorial, i checked vuex version, and i found out that you forgot to add setSelected mutation on the store
@mohamedbensalah7169
@mohamedbensalah7169 4 года назад
thank you
@kaustubhbagwe6718
@kaustubhbagwe6718 2 года назад
how can one append checked checkbox value in url ?
@skbindas5846
@skbindas5846 2 года назад
Hello Mr. Povilas Korop, Thank you for good explanation but one more thing How we will be manage if these filters is coming dynamically. I mean there is a fruite category With mango, bnana, orange etc Vehicle category With bikes, cars, bus etc And all is coming dynamically from DB in a single array I have render them as category with drop-down with multiple checkbox of related product so How we can send category along With the product?. Hope u understand my query. Actually it would be same as Multi-level categories with multiple filters for product and category E-Shop in Vue.js Thanks in advance
@jcc5018
@jcc5018 4 года назад
I'm going have to explore this deeper when i get to this part of my application, but if you have an app in which the filterable content may be different for various sections, do you still have to hard code the sections (prices, categories, etc) or would there be a way to accomplish this based on a tag table. An example would be Amazon, where their filters for clothing are going be a lot different than filters for computers or books. If you have a huge site, manually imputing all those potential filters would be difficult. I will say thanks either way though, all your videos seem to address almost everything I've been questioning, or know I'm going need to address later.
@PovilasKorop
@PovilasKorop 4 года назад
Of course, if your filters are dynamic, the variables should be dynamic too, but the code is much more complicated then, not planning to shoot a video about that specific scenario. Please experiment yourself as a "homework" :)
@jcc5018
@jcc5018 4 года назад
@@PovilasKorop I shall, now that I'm starting to get a better understanding of what Vue is actually for, I will have to explore that.
@heyyy4987
@heyyy4987 4 года назад
amazing..
@dekuddus
@dekuddus 4 года назад
Thanks laravel business to accept my request and share the tutorial. But I think you missed one thing I had told you. The previous project structure and this project structure is diffferent. Previous one category, sub category and child category is recursively in same table. And category has a relation with product so no category column exist in product table. But this project product table contain categoryid. If you share a tips how can filter product according to previous project category system and product table structure. Again a lot of thanks for such an amazing tutorial.
@PovilasKorop
@PovilasKorop 4 года назад
I rarely do the video with the EXACT question that was posted. I transform the question to be useful to the broader audience. In this case, it would be useful for projects without recursive structure. Sorry, not planning the video on specifically THAT scenario, it's quite rare.
@dekuddus
@dekuddus 4 года назад
@@PovilasKorop ok. I got it. Thanks to laravel business and also ❤❤.
@atefrihane
@atefrihane 4 года назад
@kaddus Munsi it's the same logic.. first load categories having (parent_id == null) and create a custom method in category model to get the sub ones and eager load it... in the front they will be all categories to fetch with ids... send them to back end and fetch according to Product model using " whereHas"...
@tanzimibthesam5861
@tanzimibthesam5861 4 года назад
Need a Laravel Vue course
@jhjitu8489
@jhjitu8489 3 года назад
Can you please do the same with Express and react please please please 🙏🙏🙏
@amitgatewaysol
@amitgatewaysol 3 года назад
Plz share the code
@supram941g5
@supram941g5 4 года назад
There is no reason why request() may appear in the model
@tanzimibthesam5861
@tanzimibthesam5861 4 года назад
Waiting for someone to comment blade+ jQuery good enough lol
@tanzimibthesam5861
@tanzimibthesam5861 4 года назад
@@davidbasil2727 lol
@mohidden
@mohidden 4 года назад
@@tanzimibthesam5861 im with good enough for a simple thing , in huge things u most use vuejs .
Далее
PHP on the frontend! No more Javascript!
14:47
Просмотров 119 тыс.
Miyagi & Andy panda - minor (пародия Beatrise)
0:30
Let's create a filter table component in Vue
30:53
Просмотров 21 тыс.
Laravel Vue SPA: Roles and Permissions
7:42
Просмотров 53 тыс.
About/Contact Pages: Structuring Routes in Laravel
8:03
Laravel Vue.js Fetch Data with Axios: A Complete Guide
10:57
Дарю Самокат Скейтеру !
0:42
Просмотров 7 млн
ТАТУ для БАБУШКИ
0:26
Просмотров 1,5 млн
Use this instead 😎
0:20
Просмотров 14 млн