JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">        

<div class="card">
            <div class="card-body">
            <form id="clear">
                <div class="row">

                  <!--Name-->
                  <div class="col-md-2 pl-1">
                        <div class="form-group" id="filter_col0" data-column="0">
                            <label>Search</label>
                            <input type="text" id="test" name="" class="form-control column_filter" id="col0_filter">
                        </div>
                    </div>
                  
                  <!--Job-->
                  <div class="col-md-2 pl-1">
                        <div class="form-group" id="filter_col1" data-column="1">
                            <label>欄位</label>
                            <select id="JobID" class="form-control" id="col1_filter">
                                    <option value="0">0</option>
                                    <option value="1">1</option>
                                    <option value="2">2</option>
                            </select>
                            </div>
                      </div>
              
                </form>
                <div class="text-center">
                  <button type="button" class="test_column_filter">test</button>
                </div>
            </div>
        </div>
        <hr>

<!---------------------------------------------------------------------------------------------------->
<div class="card row">
    <div class="col-lg-12">
            <br>

                <header>
                <div class="table-responsive">
                    <table id="ex" class="table table-striped table-bordered">
                       ...

JavaScript

function filterColumn () {
         var str = $('#test').val();
         var selected = parseInt($('#JobID').val());
         console.log(str, selected);
         $('#ex').DataTable().columns(selected).search(str).draw();
    }
    
    $(document).ready(function() {
        $('#ex').DataTable();
        
    
        $('.test_column_filter').on( 'click', function () {
            filterColumn();
        } );
    } );