mdehoog / Semantic-UI-Calendar

Calendar module for Semantic UI
MIT License
805 stars 127 forks source link

calendar is not displayed correctly in a modal #133

Open JoaquinDelPrado opened 5 years ago

JoaquinDelPrado commented 5 years ago

I have a table inside the modal and inside the table in a row I have a button that shows the calendar, but it does not show correctly after the second click. y think the problem its the scroll

here's my code: // Aparición de modal y manejo de calendario semantic ui $('#cotizar_btn').click(function(){ $('.ui.modal').modal('show'); valInputDate(); // Calendario listo para usarse en cualquier lado $('.ui.calendar').calendar({ type: 'date', onChange(date, text, mode){ let day = date.getDate(); let month = date.getMonth() + 1; let year = date.getFullYear();

            if (day < 10) {
                day = '0' + day;
            } 
            if (month < 10) {
                month = '0' + month;
            } 

            let finalDate = `${year}/${month}/${day}`;
            let currentId = $(this).closest("tr").attr("id");
            let final = `${currentId}_${finalDate}`;
            $(this).closest('tr').find('#identifier').attr("name", final);
            $(this).closest('tr').find('.date_doc').text(finalDate);
            $(this).closest('tr').find('.date_doc').css('background-color', '#DAF7A6');
            // console.log( final );

            valInputDate();     
        },
        minDate: new Date(),
        popupOptions: {
            position: 'right center',
            lastResort: 'right center',
            observeChanges: false
        },
        text: {
            days: ['L', 'M', 'M', 'J', 'V', 'S', 'D'],
            months: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiebre', 'Octubre', 'Noviembre', 'Diciembre'],
            monthsShort: ['En', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
            today: 'Hoy',
            now: 'Ahora',
            am: 'AM',
            pm: 'PM'
        },
    });
    //Calendario fin
});

screenshot from 2019-01-16 16-44-03