*** The technique used in the following Post is only available if you are using the Bootstrap 5 version of the Shopping Cart -- see Posts at the beginning of the Shopping Cart Section *** Now that we have a d-flex grid (which is based on a css flexgrid) it is relatively straightforward to introduce [...]
Category: Home - All Categories
This category contains pages for each of the category lists
Adding a Star Rating system to your application – Step 5 – Changing the View to use the CSS Star Rating component
The next step is straight forward. We need to modify the ratecourt view to replace the simple number based rating with our new bootstrap-star-rating component. To do this, open the file resources/views/courtratings/ratecourt_fields.blade.php and replace the blade helper which creates the rating field with the following line {!! Form::number('rating', null, ['class' => 'rating', 'data-min' => 0, [...]
Adding a Star Rating system to your application – Step 6 - Viewing an average of all ratings submitted
Laravel Eloquent provides a range useful functions that operate over Collections. Collections are basically a more sophisticated version of an array of object with a range of additional features which allow you to query, filter and control the results. Some useful functions can be found here https://laravel.com/docs/6.x/collections#available-methods. One of these methods provides an ability to [...]
Adding a Star Rating system to your application – Step 7 – Drilling down on the average rating
In order to drill down on the ratings behind the average, we need a simple page which will show a list of ratings for a specific given court. To do this we can use the standard court ratings view and modify it but we will need to adapt things slightly so that we can pass [...]
Adding Interactive Maps to Laravel Applications with Leaflet js - Step 1 - get json data
Leaflet is a lightweight javascript library for interactive maps which relys on the openstreetmap.org free geospatial data open source community mapping tool. I previously had an example which integrated with google maps. Google map moved behind a paywall and while they are still very good value and have a freemium model which allows you to [...]
Adding Interactive Maps to Laravel Applications with Leaflet js - Step 2 - Installing Leaflet with Laravel Mix
To complete this step you will need to ensure Node is installed and Laravel mix is working. If you need to review this step checkout this post on installing a Star rating system http://learnlaravel.net/953/adding-a-star-rating-system-to-your-application-step-4-adding-the-star-rating-component/. To install Leaflet with node package manager type npm install leaflet To instruct mix to add leaflet to the app.js file [...]
Adding Interactive Maps to Laravel Applications with Leaflet js - Step 3 - Adding Markers to the Map based on Json
The next step uses the getJson() jquery function which makes an Asynchronous Javascript And XML call to the courts.map.json route to retrieve json data relating to the courts in the database. This function is an asychronous call meaning that the app and code will continue to execute while it is retrieving the json data. If [...]
Adding Interactive Maps to Laravel Applications with Leaflet js - Step 4 - Adding a new Location/Marker
In the last post in this series, I will explain how by clicking on a particular location on the map we can retrieve the latitude and longitude of that location and use it to create a new court in the tennis club. In order to create a new court without leaving the map itself we [...]
Displaying chart data with CanvasJs - Part 1 - Generating JSON datapoints for a chart
There are many many great javascript chart plugins that can be used to display data in a wide variety of chart formats. Canvasjs is very easy to use and deploy and can be integrated into your application. The documentation for Canvasjs here https://canvasjs.com/docs/charts/basics-of-creating-html5-chart/ describes a simple vertical bar chart that can be rendered using approximately [...]
Displaying chart data with CanvasJs - Part 2 - Rendering the data using the Canvas plugin
**If you're not using Laravel mix you can simply add a link to a CDN of CanvasJs into the Larvel view below -if you google CanvasJS CDN you'll find links and script tags for a suitably hosted CDN of CanvasJS** Installing CanvasJS for use with npm Laravel Mix In order to install CanvasJs type the [...]