In a multiple select box only the last chosen value is transmitted


#1

Hi,

I have a multiple select box, where i can choose multiple email-adresses. When I choose more than one and transmit the form-data via an ajax command only the last value is transmitted.
I “collect” with the .serialize() command.

This is the code for the login box:

<template>
<div>
    <label for="login" class="control-label">Logins anlegen f&uuml;r</label>
    <select3 class="select2_tag form-control" name="login" multiple="multiple" v-model="loginUebertrag" 
    :options="login">
    </select3>
</div>
</template>
<script>
import JQuery from 'jquery'
let $ = JQuery
import Select3 from '@/components/Select3.vue'

export default {
    name: 'Login',

    data: function () {
        return {
            login: [],
            loginUebertrag: []
        }
    },

    components: {
        Select3
    },

    methods: {
        lade_login: function () {
            let vm = this;
            $.getJSON("/ajax/neukundenanlage/get_login.php", function (result) {
                vm.login = result;

            });
        },
    },

    mounted()
    {
        this.lade_login();
    }
    }

</script>

Thanks in advance!


#2

I found the cause for the error.
An $.ajax() call transfers the string with the options into an array. In this array, only the last option is saved.

So ist not a select2 problem, its a jquery problem.