<style>
    .pull-left{
float: left !important;
}
</style>
<table id="myTable" class="table table-striped table-bordered dt-responsive nowrap scrolldown" style="width:100%;">
        <thead>
            <tr>
                <!-- <th style="width : 100px;">#</th>
                <th style="width : 100px;">Sr.No.</th> -->
                <th style="width : 700px;">Description</th>
                <th style="width : 200px;">Action</th>
               
            </tr>
        </thead>
        <tbody>
            <?php 
         $srno = 1;
        foreach($data as $result) {                                     
        ?>
            <tr>
                <!-- <td style="width : 100px;">
                    <input type="checkbox" value="{{$result->Description}}" name="ChkValue[]"
                        class="common_selector ChkValue">
                </td>
                <td style="width : 100px;">{{$srno}}</td> -->
                <td style="width : 700px;">
                    <a href="javascript:void(0);" onclick="getDescValue('{{$result->Description}}')">{{$result->Description}}</a></td>
                <td style="width : 200px;">
                    <a data-id="{{$result->id}}" href='javascript:void(0);' data-toggle="tooltip" data-placement="top"
                        title="Edit" data-original-title="Edit" class="update"><i
                            class="lnr lnr-pencil mr-2"></i></a>&nbsp;&nbsp;
                    <a data-id="{{$result->id}}" href='javascript:void(0);' data-toggle="tooltip" data-placement="top"
                        title="Delete" data-original-title="Delete" class="delete" id="bootbox-confirm"><i
                            class="lnr lnr-trash text-danger"></i></a>
                </td>
               
            </tr>
            <?php $srno++;}  ?>
        </tbody>
    </table>

<script>
    
$(document).ready(function() {
//     $('#example').DataTable({
//         "pageLength": 200,
//         "paging": false,
//         "ordering": false,
//         "info": false,
//         "dom": '<"myCustomClass"f>rt<"bottom"lp><"clear">'
//     });
//     var table = $('#example').DataTable();
 
// $('div.dataTables_filter input', table.table().container()).focus();
// $('.dataTables_filter').addClass('pull-left');
// $('.dataTables_filter input[type="search"]').css(
//      {'width':'300px','display':'inline-block'}
//   );
    // function get_filter(class_name) {
    //     var filter = [];
    //     $('.' + class_name + ':checked').each(function() {
    //         filter.push($(this).val());
    //     });
    //     return filter;
    // }

    // $('.common_selector').click(function() {
    //         var ChkValue = get_filter('ChkValue');
    //         var ValueId = $('#ValueId').val();
    //         if (ChkValue == null) {
    //             $('#' + ValueId).val('');
    //         } else {
    //             $('#OldValue').val(ChkValue);
    //         }
            
    // });



});

function getDescValue(val) {
    var ValueId = $('#ValueId').val();
    var CurrValue = $('#' + ValueId).val();
    var OldValue = val;
    var ModalValue = $('#ModalValue').val();


    // If current field is empty, set it directly
    if (CurrValue == "") {
        $('#' + ValueId).val(OldValue);
    } else {
        // If field is one of the exceptions, replace value directly
        if (ValueId == 'ReMedia' || ValueId == 'LeMedia' || ValueId == 'ReOptDisc' || ValueId == 'LeOptDisc' ||
            ValueId == 'ReMacBV' || ValueId == 'LeMacBV' || ValueId == 'ReBv' || ValueId == 'LeBv' ||
            ValueId == 'ReMidPerPh' || ValueId == 'LeMidPerPh') {
            $('#' + ValueId).val(OldValue);
        } else {
            // Else, append with slash (or colon if already replaced)
            var ConcatValue = CurrValue + "/" + OldValue;
             // Check if value starts with RE, LE, or BE and replace '/' with ':'
    if (/^(RE|LE|BE)\b/.test(ConcatValue)) {
        ConcatValue = ConcatValue.replace(' /', ':');
    }
            $('#' + ValueId).val(ConcatValue);
        }
    }

    $('#modal-report').modal("hide");
}

</script>