Topic: "name" attribute for MDBSelect
Hi, I am having trouble using MDBSelect inside a form because I cannot set the name attribute for the MDBSelect input. This attribute is added to the <div class="select-wrapper" name="..." instead of being added directly to the input. As a result, when submitting the form, the POST request does not include the value of this select field. Can you please provide a solution to this problem?
Code snippet:
<form method="POST">
<mdb-select
name="fruit"
label="Select fruit"
v-model:options="fruits"
filter="true"
/>
<input type="submit" value="Save" />
</form>
Hi! The name (and other attributes) are beeing added to the select wrapper element. If you want to add the name attribute to the input (from select component) you can add it inside the onMounted hook like this:
onMounted(()=>{
const inputEl = document.querySelector("#selectRef input")
inputEl.name = "my-name"
})
You can checkout my snippet here:
https://mdbootstrap.com/snippets/vue/b-cylwik/6008556#js-tab-view
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: No
- Technology: MDB Vue
- MDB Version: MDB5 4.1.1
- Device: Laptop
- Browser: Firefox
- OS: Arch Linux
- Provided sample code: No
- Provided link: No