Selecting dropdown inside of editor modal broke in Firefox

Selecting dropdown inside of editor modal broke in Firefox

kumamarikumamari Posts: 24Questions: 9Answers: 1

I am trying to figure out why my dropdowns work in Chrome but not in Firefox. I have my editor setup and my select dropdowns are not responding. I have looked in the console and I do not see any javascript error. Here is my code for including the plugins.

    <!-- jQuery UI -->
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

    <!-- Datatables -->
    <link rel="stylesheet" type="text/css" href="css/editor.dataTables.css">
    <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/select/1.2.5/css/select.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedcolumns/3.2.4/css/fixedColumns.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="css/itemCreation.css">

    <script type="text/javascript" src="https://cdn.datatables.net/fixedcolumns/3.2.4/js/dataTables.fixedColumns.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.3.1/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/select/1.2.5/js/dataTables.select.min.js"></script>
    <script type="text/javascript" src="js/dataTables.editor.js"></script>
    <script type="text/javascript" src="js/dataTables.colResize.js"></script>

    <!-- CK Editor -->
    <script type="text/javascript" src="js/ckeditor/ckeditor.js"></script>

    <!-- Scripts for functionality -->
    <script src="js/jquery.validate.min.js"></script>
    <script src="js/additional-methods.js"></script>

Here is my code for the editor fields

    editor = new $.fn.dataTable.Editor( {
        ajax:  '/manager/creation/getRecords.php',
        table: '#scratchTable',
        display: 'lightbox',
        fields: [{
            label: "Item ID:",
            name: "item_id"
        }, {
            label: "Short Description:",
            name: "item_desc",
        }, {
            label: "Full Description:",
            type: "textarea",
            name: "item_name"
        }, {
            label: "Full Detail:",
            type: "textarea",
            name: "item_detail"
        }, {
            label: "Start Date:",
            name: "auc_start",
            type: 'datetime'
        }, {
            type:  "select",
            label: "Time Zone:",
            name:  "tzoffset",
            options: [
                { label : "Please select", value: '' },
                { label : "Eastern", value: '0' },
                { label : "Central", value: '1' },
                { label : "Mountain", value: '2' },
                { label : "Pacific", value: '3' },
                { label : "Alaska", value: '4' },
                { label : "Hawaii", value: '5' }
            ]
        }, {
            label: "Start Time:",
            name: "start_time",
            type: "select",
            options: [
                { label : "Please select", value: '' },
                "00:00 A.M.",
                "00:15 A.M.",
                "00:30 A.M.",
                "00:45 A.M.",
                "01:00 A.M.",
                "01:15 A.M.",
                "01:30 A.M.",
                "01:45 A.M.",
                "02:00 A.M.",
                "02:15 A.M.",
                "02:30 A.M.",
                "02:45 A.M.",
                "03:00 A.M.",
                "03:15 A.M.",
                "03:30 A.M.",
                "03:45 A.M.",
                "04:00 A.M.",
                "04:15 A.M.",
                "04:30 A.M.",
                "04:45 A.M.",
                "05:00 A.M.",
                "05:15 A.M.",
                "05:30 A.M.",
                "05:45 A.M.",
                "06:00 A.M.",
                "06:15 A.M.",
                "06:30 A.M.",
                "06:45 A.M.",
                "07:00 A.M.",
                "07:15 A.M.",
                "07:30 A.M.",
                "07:45 A.M.",
                "08:00 A.M.",
                "08:15 A.M.",
                "08:30 A.M.",
                "08:45 A.M.",
                "09:00 A.M.",
                "09:15 A.M.",
                "09:30 A.M.",
                "09:45 A.M.",
                "10:00 A.M.",
                "10:15 A.M.",
                "10:30 A.M.",
                "10:45 A.M.",
                "11:00 A.M.",
                "11:15 A.M.",
                "11:30 A.M.",
                "11:45 A.M.",
                "12:00 P.M.",
                "12:15 P.M.",
                "12:30 P.M.",
                "12:45 P.M.",
                "01:00 P.M.",
                "01:15 P.M.",
                "01:30 P.M.",
                "01:45 P.M.",
                "02:00 P.M.",
                "02:15 P.M.",
                "02:30 P.M.",
                "02:45 P.M.",
                "03:00 P.M.",
                "03:15 P.M.",
                "03:30 P.M.",
                "03:45 P.M.",
                "04:00 P.M.",
                "04:15 P.M.",
                "04:30 P.M.",
                "04:45 P.M.",
                "05:00 P.M.",
                "05:15 P.M.",
                "05:30 P.M.",
                "05:45 P.M.",
                "06:00 P.M.",
                "06:15 P.M.",
                "06:30 P.M.",
                "06:45 P.M.",
                "07:00 P.M.",
                "07:15 P.M.",
                "07:30 P.M.",
                "07:45 P.M.",
                "08:00 P.M.",
                "08:15 P.M.",
                "08:30 P.M.",
                "08:45 P.M.",
                "09:00 P.M.",
                "09:15 P.M.",
                "09:30 P.M.",
                "09:45 P.M.",
                "10:00 P.M.",
                "10:15 P.M.",
                "10:30 P.M.",
                "10:45 P.M.",
                "11:00 P.M.",
                "11:15 P.M.",
                "11:30 P.M.",
                "11:45 P.M."
            ]
        },  {
            type:  "select",
            label: "Display:",
            name:  "display_item",
            options: [
                { label : "Please select", value: '' },
                { label : "ON", value: '1' },
                { label : "OFF", value: '0' }
            ]
        }, {
            type:  "select",
            label: "Taxable:",
            name:  "taxable",
            options: [
                { label : "Please select", value: '' },
                { label : "ON", value: '1' },
                { label : "OFF", value: '0' }
            ]
        }, {
            label: "Item Count",
            name: "item_count"
        }, {
            label: "Primary Image:",
            name: "primary",
            type: "upload",
            dragDrop: true,
            display: function (file_id) {
                // Let's refresh the cached image! What a pain this was to figure out.
                var d = new Date();
                return '<img class="imageCollect" src="https://photo.xyz.net/images/' + org_id + '/temp/' + file_id + '_scratch_primary.jpg?timestamp=' + d.getTime() + '" />';
            },
            clearText: "Remove Image",
            noFileText: 'No image',
            ajaxData: function (data) {
                data.append('id', editor.val('DT_RowId'));
            }

        }, {
            label: "Secondary Images:",
            name: "secondary",
            type: "uploadMany",
            dragDrop: true,
            display: function (file_id) {
                // Let's refresh the cached image! What a pain this was to figure out.
                var d = new Date();
                return '<div class="secondaryContainer"><img class="imageCollect" src="https://photo.xyz.net/images/' +org_id +  '/temp/' + file_id + '_scratch_secondary.jpg?timestamp=' + d.getTime() + '" /></div>';

            },
            clearText: "Remove Image",
            noFileText: 'No image',
            ajaxData: function (data) {
                data.append('id', editor.val('DT_RowId'));
            }
        }, {
            name: "DT_RowId",
            type: "hidden"
        },{
            name: "file_upload",
            type: "hidden"
        }]
    } );

Any help is appreciated!

Answers

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    This one: name: "start_time", ?

    I don't immediately see anything wrong with it! Can you give me a link to a page showing the issue please?

    The dropdown in this example appears to work okay in Firefox for me.

    Allan

This discussion has been closed.