bootstrap-sweetalert icon indicating copy to clipboard operation
bootstrap-sweetalert copied to clipboard

Using with select input

Open vmosoti opened this issue 7 years ago • 1 comments

Anybody with an example on how to use sweet-alert to display a select input?

vmosoti avatar Jan 14 '18 22:01 vmosoti

I used this code:

<!-- SweetAlert input select hack-->
<style>
    div.sweet-alert div.form-group input.form-control[placeholder="hidden"] {
        display: none;
    }
</style>
<script>

    swal({
        title: "Alert with select",
        text: '<p">Select something</p>' +
        '<select class="sweet-select">' +
        '   <option value=""></option>' +
        '   <option value="1">one</option>' +
        '   <option value="2">two</option>' +
        '   <option value="3">three</option>' +
        '</select>',
        type: "input",
        html: true,
        inputPlaceholder: 'hidden',
        showCancelButton: true,
        closeOnConfirm: false
    }, function (inputValue) {
        if (inputValue === false) return false;
        if (inputValue === "") {
            swal.showInputError("You need to select something!");
            return false
        }

        swal("It works!", 'Your selected: ' + inputValue, "success");
    });

    //SweetAlert input select hack
    $('body').on('change', '.sweet-select', function () {
        $(this).closest('.sweet-alert')
            .find('div.form-group input.form-control[placeholder="hidden"]')
            .val($(this).val());
    });
</script>

mrcool-ru avatar Feb 08 '18 05:02 mrcool-ru