make a button disappear

Asked

Viewed 138 times

1

I have a code where it creates a table if it has a record in the database. In this table, in the last column there is a button that when clicking opens a more detailed screen about that table row. I need to make this button appear only on the first two rows of the table, so that no buttons appear on the other lines. I am trying in several ways, but so far I have not achieved any breakthrough. My code is in Codeigniter.

View:

<div data-widget-editbutton="false" id="wid-id-0" class="jarviswidget jarviswidget-color-blueDark jarviswidget-sortable" role="widget">
    <header role="heading">
        <h2><?= $this->lang->line("view_laudo_wg_title"); ?></h2>
    </header>


    <div role="content">
        <div class="jarviswidget-editbox">
        </div>
        <div class="widget-body no-padding">
            <div class="widget-body-toolbar">
            </div>
            <?= $this->table->generate(); ?>
        </div>
    </div>
</div>
<script type="text/javascript">
    pageSetUp();
    var iMin;
    var iMax;

    $("#filtrar_data").on('click', function () {
        iMin = $('#dateMin').val();
        iMax = $('#dateMax').val();
        oTable.fnDraw();
    });

    var oTable = $('#tabletools').dataTable({
        "sProcessing": '<?= $this->lang->line("datatable_process"); ?>',
        "bProcessing": true,
        "bServerSide": true,
        "bAutoWidth": true,
        "sAjaxSource": "<?php echo base_url() . $caminho; ?>",
        "fnDrawCallback": function (oSettings) {
            $("td:nth-child(1)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(1)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(4)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(4)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(5)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(5)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(6)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(6)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(7)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(7)").addClass('hidden-md hidden-sm hidden-xs');
            $("[rel=tooltip]").tooltip();
        },
        "oLanguage": {
            "sProcessing": "<?= $this->lang->line("datatable_process"); ?>",
            "sZeroRecords": "<?= $this->lang->line("datatable_records"); ?>",
            "sInfo": "<?= $this->lang->line("datatable_info"); ?>",
            "sInfoEmpty": "<?= $this->lang->line("datatable_empty"); ?>",
            "sInfoFiltered": "<?= $this->lang->line("datatable_filter"); ?>",
            "sInfoPostFix": "",
            "sUrl": "",
            "oPaginate": {
                "sFirst": "<?= $this->lang->line("datatable_first"); ?>",
                "sPrevious": "<?= $this->lang->line("datatable_previous"); ?>",
                "sNext": "<?= $this->lang->line("datatable_next"); ?>",
                "sLast": "<?= $this->lang->line("datatable_last"); ?>"
            }
        },
        "fnInitComplete": function (oSettings, json) {
            $(this).closest('#dt_table_tools_wrapper').find('.DTTT.btn-group').addClass('table_tools_group').children('a.btn').each(function () {
                $(this).addClass('btn-sm btn-default');
            });
            $("td:nth-child(1)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(1)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(4)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(4)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(5)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(5)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(6)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(6)").addClass('hidden-md hidden-sm hidden-xs');
            $("td:nth-child(7)").addClass('hidden-md hidden-sm hidden-xs');
            $("th:nth-child(7)").addClass('hidden-md hidden-sm hidden-xs');
        },
        'fnServerData': function (sSource, aoData, fnCallback) {
            aoData.push({name: '<?= $this->security->get_csrf_token_name() ?>', value: '<?= $this->security->get_csrf_hash() ?>'});
            aoData.push({name: "sSearch_1", value: iMin});
            aoData.push({name: "sSearch_2", value: iMax});
            $.ajax
                    ({
                        'dataType': 'json',
                        'type': 'POST',
                        'url': sSource,
                        'data': aoData,
                        'success': fnCallback
                    });

        }
    });

</script>

Controller:

public function index() {
        $tmpl = array('table_open' => '<table id="tabletools" class="table table-striped table-bordered table-responsive table-hover dataTable" aria-describedby="datatable_tabletools_info">');
        $this->table->set_template($tmpl);
        $this->table->set_heading('' . $this->lang->line("con_laudo_th_ti") . '', '' . $this->lang->line("con_laudo_th_dh") . '', '' . $this->lang->line("con_laudo_th_op") . '', '' . $this->lang->line("con_laudo_th_di") . '', '' . $this->lang->line("con_laudo_th_de") . '', '' . $this->lang->line("con_laudo_th_nr") . '', '' . $this->lang->line("con_laudo_th_pe") . '', '' . $this->lang->line("con_laudo_th_ac") . '');
        $data['caminho'] = 'ConLaudos/generateTable';

            $this->load->view('ViewLaudos', $data);

    }

    public function generateTable() {

            echo $this->ML->getLaudos($this->lang->line("con_laudo_tip_insp_v"), $this->lang->line("con_laudo_tip_insp_e"), $this->lang->line("con_laudo_per_insp_u"), $this->lang->line("con_laudo_per_insp_r"), $this->lang->line("con_laudo_acoes_insp"));

    }

Model:

public function getLaudos($vei, $est, $urb, $rur, $aca) {
        $this->datatables->select('ls.lau_id, ls.lau_tipo, ls.lau_data, usu.usr_nome, dispo.dsp_nome, ls.lau_densidade, ls.lau_nivel, ls.lau_zona, ls.lau_status');
        $this->datatables->from('ls');
        $this->datatables->join('usu', 'ls.usr_id = usu.usr_id');
        $this->datatables->join('dispo', 'ls.dsp_id = dispo.dsp_id');
        $this->datatables->join('empresa', 'empresa.emp_id = usu.emp_id');
        $this->datatables->where('usu.emp_id = ' . $this->session->userdata('emp_id') . ' AND usu.usr_nivel<>0');

        $this->datatables->unset_column('ls.lau_id');
        $this->datatables->unset_column('ls.lau_status');
        $this->datatables->add_column('Ações', '$1', 'get_buttons_ls(ls.lau_id, ls.lau_status, ls.lau_tipo,' . $aca . ')');
        $this->datatables->edit_column('ls.lau_tipo', '$1', 'trataLauTipo(ls.lau_tipo,' . $vei . ',' . $est . ')');
        $this->datatables->edit_column('ls.lau_data', '$1', 'tratarDataHora(ls.lau_data)');
        $this->datatables->edit_column('ls.lau_zona', '$1', 'trataLauPerimetro(ls.lau_zona,' . $urb . ',' . $rur . ')');
        $this->datatables->edit_column('ls.lau_status', '$1', 'trataLauStatus(ls.lau_status)');
        return $this->datatables->generate();
    }
  • Why so many repeats on Nth-Child? Also you can do it this way: Childrens[number] = 'Nth-Child('number+')'; $('td:'+Childrens+',th:'+Childrens). addClass('Hidden-Md Hidden-Sm Hidden-Xs')

  • @Ivanferrer this code was someone else who did, I’m just fixing it, I don’t know exactly why so many repetitions. I have tried to contact the same, but does not answer me. Since I graduated!

1 answer

1

Change your code for this:

  <script type="text/javascript">
  function setClassTable() {
     $("td:nth-child(1),th:nth-child(1)")
            .addClass('hidden-md hidden-sm hidden-xs');

      for (var i=4; i<=7; i++) {
             $("td:nth-child("+i+"),th:nth-child("+i+")")
             .addClass('hidden-md hidden-sm hidden-xs');
      }
         $("tr:nth-child(1) td:nth-last-child(1),tr:nth-child(2) td:nth-last-child(1)")
            .removeClass('hidden-md')
            .removeClass('hidden-sm')
            .removeClass('hidden-xs');
  }
    pageSetUp();
    var iMin;
    var iMax;

    $("#filtrar_data").on('click', function () {
        iMin = $('#dateMin').val();
        iMax = $('#dateMax').val();
        oTable.fnDraw();
    });

    var oTable = $('#tabletools').dataTable({
        "sProcessing": '<?= $this->lang->line("datatable_process"); ?>',
        "bProcessing": true,
        "bServerSide": true,
        "bAutoWidth": true,
        "sAjaxSource": "<?php echo base_url() . $caminho; ?>",
        "fnDrawCallback": function (oSettings) {

         setClassTable();

         $("[rel=tooltip]").tooltip();
        },
        "oLanguage": {
            "sProcessing": "<?= $this->lang->line("datatable_process"); ?>",
            "sZeroRecords": "<?= $this->lang->line("datatable_records"); ?>",
            "sInfo": "<?= $this->lang->line("datatable_info"); ?>",
            "sInfoEmpty": "<?= $this->lang->line("datatable_empty"); ?>",
            "sInfoFiltered": "<?= $this->lang->line("datatable_filter"); ?>",
            "sInfoPostFix": "",
            "sUrl": "",
            "oPaginate": {
                "sFirst": "<?= $this->lang->line("datatable_first"); ?>",
                "sPrevious": "<?= $this->lang->line("datatable_previous"); ?>",
                "sNext": "<?= $this->lang->line("datatable_next"); ?>",
                "sLast": "<?= $this->lang->line("datatable_last"); ?>"
            }
        },
        "fnInitComplete": function (oSettings, json) {
            $(this).closest('#dt_table_tools_wrapper').find('.DTTT.btn-group').addClass('table_tools_group').children('a.btn').each(function () {
                $(this).addClass('btn-sm btn-default');
            });

         setClassTable();
        },
        'fnServerData': function (sSource, aoData, fnCallback) {
            aoData.push({name: '<?= $this->security->get_csrf_token_name() ?>', value: '<?= $this->security->get_csrf_hash() ?>'});
            aoData.push({name: "sSearch_1", value: iMin});
            aoData.push({name: "sSearch_2", value: iMax});
            $.ajax
                    ({
                        'dataType': 'json',
                        'type': 'POST',
                        'url': sSource,
                        'data': aoData,
                        'success': fnCallback
                    });

        }
    });

</script>
  • I put this code that you sent, it didn’t change anything, the button appears in all records yet, and not just in the first two. Thank you!

  • @Ketlin, publish the $this->table->generate() method, the one that builds the table, I need to see how you’re putting it together, or build the table so I understand where you want to hide the first 2 buttons. How many columns and rows have?

  • I put all the code I have, I didn’t make it, I have to fix it just. I don’t understand it right either. All I have related to this table is this. It has 8 columns, and the last one goes this button. No controller no generateTable no part $this->lang->line("con_laudo_acoes_insp"); that’s where the button name is. I hope I’ve been helping. Grateful for the attention

  • I made a change, see if it works now.

  • Also did not work, the screen gets the message that is loading the data and the button also not disappeared.

  • I thought of making an equation(all records - all records + 2 records) however I did not succeed in turning into code.

  • This last column, what is its structure like? You can hide the button inside the for. type: if (i > 2) { 'hidden element'; } and leaves the others visible, in case you can also pass the class I think it is something like table:last-of-type

  • Now I think you’re right

  • opened the discussion in chat. Grata

Show 5 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.