displaying the filtered custom taxonomy - php

Question

Still trying to figure it out how could I filter the custom taxonomy and display it. the JS is for firing the URL generated is working fine. the problem is the results page items are not showing. I have this code so far:
<?php
$args = array(
'orderby' => 'slug',
'order' => 'ASC',
'parent' => 0,
'hide_empty' => false
);
$terms = get_terms([
'taxonomy' => 'pdf_cat',
'hide_empty' => false,
]);
foreach( $terms as $term ){
echo '<option class="ctg" value="'. get_term_link($term->term_id) .' ">' . $term->name . '</option>';
}
//NEXT CODE IS GET THE CATEGORY ID AFTER CLICKED TO DISPLAY
<?php
$terms = get_terms([
'taxonomy' => 'pdf_cat',
'hide_empty' => false,
]); // get the category from query
$terms = $term[0];
$term_name = get_term_name($term->name); // get the category name
$term_id = get_term_ID($term->term_id); // get the catehory ID
?>
<?php
$paged = get_query_var('paged', 1);
$args = array( // asigned the functions inside the array
'paged' => $paged,
'post_type' => 'pdf',
'taxonomy' => $term_id,
);
$query = new WP_Query($args); // get the functions inside the assigned name
global $query_string; //Post the specify numbers per page
query_posts( $query_string . "&posts_per_page=12&paged=".$paged );
while ( have_posts() ) : the_post()
?>
and here is the js to fire the dropdown menu link when clicked:
<script type="text/javascript">
$("#form").change(function(){
var url = $(this).val();
location.assign(url);
});
</script>
//NEXT CODE IS TO THE DISPLAY
<div class="pdf-box">
<?php
$file = get_field('file');
if( $file ): ?>
<a href="<?php echo $file['url']; ?>" target="_blank"><?php echo $file['file']; ?>
<div class="service-list-col1">
<i class="fa-file-o"></i>
</div>
<div class="service-list-col2">
<p><?php the_time('Y.m.d'); ?></p>
<h3><?php the_title(); ?></h3>
</div>
</a>
<?php endif; ?>
</div>