Height issue in Show Entries Dropdown

ddretna

Hi.. Can someone tell me how to manipulate dropdown height in show entries? The numbers is not displaying correctly

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

ddretna

Js:

$(document).ready(function () {
    url = window.location.search;
    $split_nya = url.split("&id=");
    if ($split_nya[1]) {
        CallExistingData()
    }
    GenerateTable();
});

function GenerateTable() {
    table = $('#DataLocation').DataTable({
        'processing': true,
        'serverSide': true,
        'serverMethod': 'post',
        'ajax': {
            url: $url + "HRD_MASTER_LOCATION_PAGE.php",
        },
        "aoColumns": [
            { data: 'no' },
            { data: 's_nm_location' },
            { data: 's_address_location' },
            {
                "data": null,
                "render": function (data) {
                    console.log(data);
                    return decodeURIComponent(data.button);
                }
            }
        ]
    });
}

function edit(n_id_location) {
    window.location = $url_src + "Hrd/Master/Locationform?id=" + n_id_location;
}

function deletes(n_id_location) {
    const swalWithBootstrapButtons = Swal.mixin({
        customClass: {
            confirmButton: 'btn btn-info',
            cancelButton: 'mr-2 btn btn-danger'
        },
        buttonsStyling: false,
    })
    swalWithBootstrapButtons.fire({
        title: 'Are you sure?',
        text: "You will delete the selected data!",
        type: 'warning',
        showCancelButton: true,
        confirmButtonText: 'Yes, delete it!',
        cancelButtonText: 'No, cancel!',
        reverseButtons: true
    }).then((result) => {
        if (result.value) {
            drop(n_id_location);
            swalWithBootstrapButtons.fire(
                'Deleted!',
                'Data has been deleted successfully',
                'success'
            )
        }
        else if (result.dismiss === Swal.DismissReason.cancel) {
            swalWithBootstrapButtons.fire(
                'Cancelled',
                'Your data is safe',
                'error'
            )
        }
    })
}

function drop(n_id_location) {
    data = { id: n_id_location }
    var format = "3";
    $.ajax({
        type: "POST",
        cache: false,
        url: $url + "HRD_MASTER_LOCATION_FORM.php",
        data: { code: '1', format: format, data: data },
        success: function (response) {
            data = response;
            // console.log(data);
            d = JSON.parse(data);
            console.log(d.message);
            if (d.respon == '200') {
                GenerateTable();
            }
            else {
                Swal.fire({
                    type: 'Error!',
                    title: 'Validation',
                    text: d.message,
                    footer: '--'
                });
            }
        }
    });
}

HTML

<!-- Start Row -->
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body">
                <!-- <h4 class="card-title">List Employee</h4> -->
                <a id="addRow" class="btn btn-primary mb-2" href="<?php echo base_url()?>Hrd/Master/Locationform"><i class="fas fa-plus"></i>&nbsp; Add Data</a>
                <div class="table-responsive">
                    <table id="DataLocation" class="table table-striped table-bordered display responsive" style="width:100%">
                        <thead>
                            <tr>
                                <th>No</th>
                                <th>Location</th>
                                <th>Address Location</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <!-- <tfoot>
                            <tr>
                                <th>No</th>
                                <th>Location</th>
                                <th>Address Location</th>
                                <th>Action</th>
                            </tr>
                        </tfoot> -->
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

tangerine

That is not a test case. Colin gave you a link to this:
https://datatables.net/manual/tech-notes/10