Cascading or dependent dropdown using React JS

Introduction In this post we will see an example on cascading or dependent dropdown using React JS. When you have a requirement for selecting dropdown values based on another dropdown values then you need to create such cascading or dependent dropdown. For example, in your application you need to select city based on state or country then you need to create such dependent dropdown. Here we will create some dummy dataset for country, state and city and we will show in the dropdown with select/option tags.

Continue

Dynamically generate years in PHP

Here in this example I am going to show you how to generate years in PHP language. Sometimes we need to select year value from dropdown or select/option field and for that we hardcode the year values in HTML option fields. It may be cumbersome at the point when we want to add a new year value to the option field as the year value grows as the time progresses. It is also bad idea to go and update the source code every year to add the new year value. You may forget…

Continue

Dependent Dropdown Example

This tutorial will show you how to create dependent or cascaded dynamic dropdown using jQuery. Sometimes we need to create such a cascaded dropdown where we need to select some value in the second dropdown based on first dropdown value. For example, we need to select city dropdown value based on country dropdown value and for this we cannot pre-populate the city dropdown value unless we know the country from country dropdown. I will explain here with an example using jQuery. The example here contains two dropdown – one is…

Continue

Dependent dropdown example in PHP, MySQL

Introduction This tutorial shows how to create dependent dropdown in PHP and MYSQL. This is also called cascaded dropdown. This tutorial uses JavaScript to submit the form automatically when the first dropdown value is selected. Sometimes we need to create such a cascaded dropdown when we need to select some value in the second dropdown based on first dropdown value or third dropdown value based on second dropdown value.

Continue

Add input fields to form dynamically using jQuery

Introduction This tutorial shows an example how to add input fields to form dynamically using jQuery. Input field types may be text, textarea or file to the form. We also have added remove button next to the added input field to remove the field if you do not need it. For this example, I have used here jQuery for dynamically adding inputs, CSS for some basic style and HTML code. How does it work? We have select/option for what type of input to be added to the form. We have…

Continue