error showing options of a select in laravel and vue js

Question

error showing options of a select in laravel and vue js

Navigation

#1 by (1 votes)
#2 by (1 votes)

1

does not show anything in the option but in the console if I can see the data

  new Vue({
    el: '#aplicacion',
    data: {
        departamento:'',
        municipios:[],
      },
      methods: {
        greet: function (event) {
            var id = event.target.value;
            var url = 'https://localhost/todojuegos/todojuegos/public/municipio/'+id;
            axios.get(url)
              .then(function (response) {
                this.municipios = response.data;
                console.log(this.municipios);
              })
              .catch(function (error) {
                console.log(error);
              });
        }
      },
});

HTML

 <select id="Municipio" class="form-control{{ $errors->has('Municipio') ? ' is-invalid' : '' }}" required>
                                    <option value="" disabled selected>Selecciona</option>
                                    <option v-for="muni in municipios">
                                    @{{ muni.municipio }}
                                    </option>
                                </select>

laravel-5 laravel-blade vue.js

asked by Andersson Meza Andrade 20.05.2018 в 03:11

source

2 answers

Is there a way to create a list for each item in another list? Query Oracle SQL HR schema, how to get a query referring to dates?

score 1 · Answer 1

Within the option grouping tag, you must have an option that is the one or those that are going to list the values that are arriving to you; as follows

 <select v-for="muni in municipios">
    <option value="">@{{ muni.municipio }}</option>
  </select>

Important.

Within the option, you have an attribute called value, there you are going to send for example the id, of your registry so that when the user sees your select, he / she chooses the name of the municipality but the system in the value takes the id of the chosen municipality, more or less like that look

 <select v-for="muni in municipios">
    <option value="@{{ muni.id }}">@{{ muni.municipio }}</option>
  </select>

Of course this verifies the name of your keys that are arriving but this should serve you as a guide

score 1 · Answer 2

1

The error was solved the reason was to place the function here

.then(function (response) {}

instead place

.then(response => {

          }

and it worked I update the municipality variable

answered by 20.05.2018 в 04:06