[ef1]

вот весь код

<hr class="uk-divider-icon">
<div  class="uk-flex uk-flex-center" uk-grid > 
  <div class="uk-width-3-4"> 
	<div id="_SortAndViewPanel" class="uk-section uk-section-muted uk-padding-small uk-clearfix uk-border-rounded uk-box-shadow-xlarge uk-overlay-primary" style="border: 0.5px solid silver; border-radius: 40px 10px; border-top-style:none; border-left-style:none">
    
		<div class="uk-flex uk-flex-middle uk-float-left">
<!-- byDir -->
			<ul id="_list_byDir" class="uk-switcher" uk-tooltip="title: Сортировка по направлению; pos: top-right"> 
				<li class="uk-animation-shake"><a href="?byDir=asc" uk-icon="icon: chevron-up; ratio:	1.5"></a></li>
				<li class="uk-animation-shake"><a href="?byDir=desc" uk-icon="icon: chevron-down; ratio: 1.5"></a></li>
			</ul>
			<div id="_hover_byDir" class="_byPanel" uk-dropdown="mode: hover; delay-hide: 0; pos: bottom-justify">
				<span>критерий</span>
				<hr>
 			  <ul class="uk-nav uk-dropdown-nav" uk-switcher="connect: #_list_byDir">
          <li><a href="?byDir=asc">по возрастанию</a></li>
					<li><a href="?byDir=desc"> по убыванию</a></li>
				</ul> 
			</div>
<!-- byName -->
			<ul id="_list_byName" class="uk-margin-small-left uk-switcher" uk-tooltip="title: Сортировка по критерию; pos: top" >
				<li class="uk-text-uppercase uk-animation-shake"><a class="uk-link-muted">Наименование</a></li>
				<li class="uk-text-uppercase uk-animation-shake"><a class="uk-link-muted">Дата</a></li>
	    </ul>
			<div id="_hover_byName" class="_byPanel" uk-dropdown="mode: hover; delay-hide: 0; pos: bottom-justify">
				<span>критерий</span>
				<hr>
				<ul class="uk-nav uk-dropdown-nav" uk-switcher="connect: #_list_byName">
					<li><a href="?byName=name">по наименованию</a></li>
					<li><a href="?byName=timestanp_x">по дате</a></li>
				</ul>
			</div>
		</div>

		<div class="uk-flex uk-flex-middle uk-float-right">
<!-- byCount -->
			<ul id="_list_byCount" class="uk-switcher" uk-tooltip="title: Количество элементов на странице; pos: top">
				<li class="uk-animation-shake"><a class="uk-link-muted">15</a></li>
				<li class="uk-animation-shake"><a class="uk-link-muted">30</a></li>
				<li class="uk-animation-shake"><a class="uk-link-muted">60</a></li>
				<li class="uk-animation-shake"><a class="uk-link-muted">80</a></li>
	    </ul>
			<div id="_hover_byCount" class="_byPanel" uk-dropdown="mode: hover; delay-hide: 0;  pos: bottom-justify">
				<span>количество</span>
				<hr>
				<ul class="uk-nav uk-dropdown-nav" uk-switcher="connect: #_list_byCount">
					<li><a href="?byCount=15">15</a></li>
					<li><a href="?byCount=30">30</a></li>
					<li><a href="?byCount=60">60</a></li>
					<li><a href="?byCount=80">80</a></li>
				</ul>
			</div>
 <!-- byView -->
			<ul id="_list_byView" class="uk-margin-small-left uk-link-reset uk-switcher" uk-tooltip="title: Вид каталога; pos: top-left">
				<li class="uk-animation-shake"><a uk-icon="icon: list; ratio:	1.5"></a></li>
				<li class="uk-animation-shake"><a uk-icon="icon: grid; ratio:	1.5"></a></li>
			</ul> 
			<div id="_hover_byView" class="_byPanel" uk-dropdown="mode: hover; delay-hide: 0;  pos: bottom-justify">
				<span>вид каталога</span> 
				<hr>
				<ul class="uk-nav uk-dropdown-nav" uk-switcher="connect: #_list_byView">
					<li><a href="?byView=list">список</a></li>
					<li><a href="?byView=board">плитка</a></li>
				</ul>
			</div>
		</div>
		
	</div>
</div>
</div>
<hr class="uk-divider-icon">

вот js мои попытки

var util = UIkit.util;
var svPanel = util.$('#_SortAndViewPanel'); //основная панель
var svPanels = util.$$('._byPanel');        //списки выбора параметров 

util.ready(function () {

  util.on(svPanels, 'click', function(event){ //событие по клику на панели 
    var aIndex=-1; //индекс элемента активной панели
    if (event.target.tagName=='A'){
      util.trigger(event, sendGet(event.target.search));   //передать get значение в php самому себе 
//      util.addClass(svPanel, 'uk-overlay-primary'); //затемнить панель
      aIndex = util.index(event.target.parentNode);
    }

   svPanels.forEach(function(userItem) {    //загасить активную панель
     if (util.isInView(userItem)) {
       UIkit.dropdown("#"+userItem.id).hide();
     }
    });

  
  }
);
  
  util.on('a', 'click', function(event){ //test
    console.log(event.target);
  });

  util.removeClass(svPanel, 'uk-overlay-primary');
});

var request = new XMLHttpRequest();
function GETreqReadyStateChange() {
    if (request.readyState == 4) {
        var status = request.status;
        if (status == 200) {
//            document.getElementById("output").innerHTML=request.responseText;
          console.log(request.responseText);
        }
    }
}

function POSTreqReadyStateChange() {
    if (request.readyState == 4 && request.status == 200)
        document.getElementById("output").innerHTML=request.responseText;
}

function sendGet(body){
  console.log(body);
  request.open("GET", body);
  request.onreadystatechange = GETreqReadyStateChange;
  request.send();
//   alert(request.responseText);
 }