Vue Login Form "remember" checkbox state ignored

[sourcecodes2]

Checking the form.remember checkbox on the login page (LoginForm.vue) does nothing.

The AJAX request always sends remember: "", even when checked.

My environment: MacOS Sierra, Chrome 61.

[ph4r05]

I am having the same issue. Click event does not get to the checkbox, v-model does not change on click.
Update: iCheck ( https://github.com/fronteed/icheck ) callback is not triggered.

[ph4r05]

I figured out the problem, the time of icheck initialization matters. I assume the icheck is initialized before it should be. If you wrap initialization in setTimeout(fnc, 1000) is starts working.

My dirty workaround:

1. I've wrapped initialization in mount to the nextTick() in LoginForm.vue:

    mounted () {
        this.$nextTick(() => {
            this.initialitzeICheck('remember');
        });
    },

2. InitializeIcheck.js - wrap to document ready, set timeout.

export default {
  methods: {
    initialitzeICheck (field) {
        const component = this;
        const compObj = $('input[name=' + field + ']');

        $(document).ready(() => {
            setTimeout(() => {
                compObj.iCheck({
                    checkboxClass: 'icheckbox_square-blue',
                    radioClass: 'iradio_square-blue',
                    increaseArea: '20%'
                });
            }, 10);

            setTimeout(() => {
                compObj.on('ifChecked', function (event) {
                    component.form.setField(field, true);
                    component.form.errors.clear(field);
                });

                compObj.on('ifUnchecked', function (event) {
                    component.form.setField(field, '');
                });

            }, 10);

        });
    }
  }
}

[acacha]

Thanks @ph4r05 for the report and for possible solution. There are other issues related with icheck (#363) so I think that instead of solving this issue I will reimplement the Login component without icheck.

[ph4r05]

@acacha thanks I did the same. I used vue-toggle component