Раскрывающийся список в фильтре данных таблицы

Я следовал за моим предложением frnd, и он работал как драгоценный камень для меня:

Рабочий код:

1) Загружен хромированный рекордер.

2) Код

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.chrome.ChromeDriver;

public class Sel {
  public static void main(String[] args) {
    // TODO Auto-generated method stub
    System.setProperty("webdriver.chrome.driver", "C:\\Users\\Downloads\\chromedriver_win32\\chromedriver.exe"); // path of chromedriver 
    WebDriver driver = new ChromeDriver();

      driver.get("https://google.ca");
      driver.manage().window().maximize();
      driver.getTitle();

  }
}
1
задан Zakaria Acharki 29 March 2019 в 11:15
поделиться

2 ответа

Проверьте следующий код, который добавит столбец attendance для каждой строки:

$(document).ready(function() {
  $('select[name="students_class_id"]').on('change', function() {
    var classID = $(this).val();

    if (classID) {
      $.ajax({
        url: '/myform/ajax/' + classID,
        type: "GET",
        dataType: "json",
        success: function(data) {
          var attendance = `<div class="form-group">
                        <select class="form-control" id="gender" name="attendance[]">
                            <option>Present</option>
                            <option>Absent</option>
                            <option>Leave</option>
                        </select>
                    </div>`;
          var markup = '';

          $.each(data, function(key, value) {
            markup += '<tr> <td><input type="hidden" value="'+value.id+'" name="id[]">' + value.id + '</td> <td>' + value.student_id + '</td> <td>' + value.first_name + ' ' + value.last_name + '</td> <td> ' + attendance + '</td> <tr>';
          });

          $('#studentsData tbody').html(markup);

          var thead_markup += '<tr> <th>A</th> <th>B</th> <th>C</th> <td>D</th> <tr>';
          $('#studentsData thead').html(thead_markup);
        }
      });
    }
  });
});
0
ответ дан Zakaria Acharki 29 March 2019 в 11:15
поделиться

Это зависит от вашего кода, если вы используете ajax datatables api, то вот аналогичный пример:

$(document).ready(function() {
    $('#example').DataTable( {
        initComplete: function () {
            this.api().columns().every( function () {
                var column = this;
                var select = $('<select><option value=""></option></select>')
                    .appendTo( $(column.footer()).empty() )
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );

                        column
                            .search( val ? '^'+val+' 

Ссылка: datatables.net multi filter select

Если вы не используя datatables api и не хотите ajax, используйте приведенный ниже код и измените его в соответствии с вашими потребностями:

 $("#selectDropdown").on("change", function () {
                    var value = $(this).val();
                    $("table tr").each(function (index) {
                        if (index != 0) {

                            $row = $(this);

                            var id = $row.find("td:first").text();

                            if (id.indexOf(value) != 0) {
                                $(this).hide();
                            }
                            else {
                                $(this).show();
                            }
                        }
                    });

                });
: '', true, false ) .draw(); } ); column.data().unique().sort().each( function ( d, j ) { select.append( '<option value="'+d+'">'+d+'</option>' ) } ); } ); } } ); } );

Ссылка: datatables.net multi filter select

Если вы не используя datatables api и не хотите ajax, используйте приведенный ниже код и измените его в соответствии с вашими потребностями:

 $("#selectDropdown").on("change", function () {
                    var value = $(this).val();
                    $("table tr").each(function (index) {
                        if (index != 0) {

                            $row = $(this);

                            var id = $row.find("td:first").text();

                            if (id.indexOf(value) != 0) {
                                $(this).hide();
                            }
                            else {
                                $(this).show();
                            }
                        }
                    });

                });
0
ответ дан Osama Alvi 29 March 2019 в 11:15
поделиться
Другие вопросы по тегам:

Похожие вопросы: