label displays over input text for Material Input with vueJs

Topic: label displays over input text for Material Input with vueJs :value

axela asked 4 years ago

<div class="md-form form-sm">
    <input type="number" id="offer_salary" name="salary" :value="current_offer.salary" class="form-control" aria-describedby="offer_salary_help" autocomplete="off">
   <label for="offer_salary">Salaire (dh)</label>
   <small id="offer_salary_help" class="form-text text-muted">
       (Champ optionnel)
    </small>
 </div>

The result is :

enter image description here How can I resolve that? Thank you

Add comment

Marcin Luczak staff answered 4 years ago

0 0 Best answer

Hi,

Please use our Input component for Vue inside Vue projects. In your case, your code would look like following:

<template>
 <mdb-input label="Salaire (dh)" v-model="current_offer.salary" small="(Champ optionnel)" />
</template>

<script>
  import { mdbInput } from 'mdbvue';
  export default {
    name: "Input",
    components: {
      mdbInput
    },
    data() {
      return {
        current_offer: {
          salary: 40000
        }
      };
    }
  }
</script>

Regards, Marcin

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

User: Free
Premium support: No
Technology: MDB jQuery
MDB Version: 4.19.1
Device: PC
Browser: Chrome
OS: Windows 10
Provided sample code: No
Provided link: No

axela

15Support score
3Questions 0Answers

0Snippets likes 0Snippets