Как отобразить отфильтрованную таблицу, где фильтрация зависит от выпадающего списка и радио - PullRequest
Новая
       31

Как отобразить отфильтрованную таблицу, где фильтрация зависит от выпадающего списка и радио

0 голосов
/ 26 марта 2019

У меня есть выпадающий список и набор из двух переключателей. Когда выбрано выпадающее значение вместе с опцией радио, мне нужно показать таблицу с выбранными соответствующими значениями. Данные извлекаются из бэкэнда CouchCMS. 

  <select id='dd_icp'>
    <option value="ET" >ET</option>
    <option value="NGP" >NGP</option>
    <option value="GCC" >GCC</option>
  </select>

  <label for="f_to_ho0">
    <input type="radio" name="f_to_ho" id="f_to_ho0" value="0" checked="checked">T/O
  </label>
  <label for="f_to_ho1">
    <input type="radio" name="f_to_ho" id="f_to_ho1" value="1"> H/O 
  </label>

  <table>
    ...
  </table>

$(document).ready(function() {
  $("#dd_icp").change(function() {
    var selectedValue = $(this).val();
    // Radio???
    // Table with data???

  });
});

1 Ответ

0 голосов
/ 26 марта 2019

В своем ответе, чтобы позволить мне просто вырезать и вставить пример, я изменил переключатель на поле выбора, но вы бы обработали переключатель аналогичным образом.

Форма 

<select id="dd_icp">
    <option value="" >Select ???</option> <!-- Forces Selection -->
    <option value="ET" >ET</option>
    <option value="NGP" >NGP</option>
    <option value="GCC" >GCC</option>
  </select>

  <select id="f_to_ho" name="f_to_ho">
    <option value="0" >T/O</option>
    <option value="1" >H/O</option>
  </select>

 <div id="results"></div>

Обратите внимание на <div id="results"></div>

jQuery 

$( "#dd_icp" ).change(function() {  
    var var_a = $(this).val();
    var var_b = $('#f_to_ho').val();
    var url = 'path-to-parse.php';
    var postit = $.post( url, {var_a:var_a,var_b:var_b});       
    postit.done(function( data ) {$('#results').html(data);});  
});

parse.php 

<?php
    $var_a = $_POST['var_a'];
    $var_b = $_POST['var_b'];

    // parse and echo filtered table here

?>

Надеюсь, это поможет.

...