Level 22
@paul_hub if you want to save selected categories or form data, make ajax request to laravel with axios.
methods: {
// call this when click submit
saveDataToDatabase() {
axios.post(route('form.store'), this.form)
}
}
Oct 19, 2022
1
Level 1
Sample Vue Select Cascading Dropdown value
i want to be able to upload the value of my select input to the database thank you in advance
Select Categories {{ option.text }} </div>
<div class="mb-4">
<select class="border-2 py-2 px-6 w-80 md:w-full rounded focus:outline-none focus:border-sky-500 focus:ring-sky-500 block sm:text-sm focus:ring-0"
name="subcategory" id="subcategory" v-model="form.subcategory">
<option :value="null" disabled selected>Select Subcategory</option>
<option v-for="option in subcategory_options[form.categories]" :value="option.id"
v-bind:key="option.id">
{{ option.text }}
</option>
</select>
</div>
</div>
categories_options: [
{
text: "Imo Politics",
id: 1
},
{
text: "World",
id: 2
},
{
text: "Politics",
id: 3
},
{
text: "Business",
id: 4
},
{
text: "Entertainment",
id: 5
},
{
text: "Sports",
id: 6
},
{
text: "Health",
id: 7
},
],
subcategory_options: {
1: [
{
text: "U.N",
id: 1
},
{
text: "Terrorism",
id: 2
},
{
text: "Disasters",
id: 3
},
{
text: "Global Economy",
id: 4
},
{
text: "Education",
id: 5
},
{
text: "Environment",
id: 6
},
{
text: "Religion",
id: 7
},
{
text: "Scandal",
id: 8
},
],
2: [
{
text: "U.N",
id: 1
},
{
text: "Terrorism",
id: 2
},
{
text: "Disasters",
id: 3
},
{
text: "Global Economy",
id: 4
},
{
text: "Education",
id: 5
},
{
text: "Environment",
id: 6
},
{
text: "Religion",
id: 7
},
{
text: "Scandal",
id: 8
},
],
3: [
{
text: "Senate",
id: 1
},
{
text: "House",
id: 2
},
{
text: "Judiciary",
id: 3
},
{
text: "Foreign Policy",
id: 4
},
{
text: "Elections",
id: 5
},
],
4: [
{
text: "Personal Finance",
id: 1
},
{
text: "Economy",
id: 2
},
{
text: "Markets",
id: 3
},
{
text: "Real Estate",
id: 4
},
{
text: "Tech",
id: 5
},
],
5: [
{
text: "Celebrity News",
id: 1
},
{
text: "Movies",
id: 2
},
{
text: "Music News",
id: 3
},
{
text: "Style News",
id: 4
},
{
text: "Entertainment Video",
id: 5
},
],
6: [
{
text: "Football",
id: 1
},
{
text: "Basketball",
id: 2
},
{
text: "Tennis",
id: 3
},
{
text: "Volleyball",
id: 4
},
],
7: [
{
text: "Coronavirus",
id: 1
},
{
text: "Healthy Living",
id: 2
},
{
text: "Medical Research",
id: 3
},
{
text: "Mental Health",
id: 4
},
{
text: "Cancer",
id: 5
},
{
text: "Heart Health",
id: 6
},
{
text: "children's Health",
id: 7
},
],
}
}),
}
Please or to participate in this conversation.