Bus Seat Reservation UI Concept

Bus Seat Reservation User Interface Concept using Vue.js

In response to this facebook post. I created a simple bus seat reservation user interface using Vue.js and SVG. I started by preparing an SVG image of the bus seat and then render the SVG elements using Javascript (VueJS). You can use a raster image (sprite) for this but I prefer to use vector graphics (SVG) because it allows me to control the stroke and background color programmatically. The bus seat vector image looks like this...

May 27, 2020 · John Pili
html5-pre-selected-disable-default.webp

HTML drop-down placeholder

Do you ever wanted to have an HTML drop-down with default selected value (placeholder) that the user cannot re-select once they selected any valid value options? It can be done easily by adding selected and disabled attributes on the option element. Code Snippet <select> <option value="" selected="selected" disabled="disabled">-- SELECT --</option> <option value="ACTIVE">ACTIVE</option> <option value="INACTIVE">INACTIVE</option> </select> Try it! -- SELECT -- ACTIVE INACTIVE

April 15, 2020 · John Pili