为搜索表单构建阵列选择选项下拉列表

时间:2017-06-25 11:06:36

标签: php html arrays wordpress wordpress-theming

我想在相同的选项下拉列表中创建价格范围过滤器下拉列表 例如:



<select name="price" class="filterSelectBox">
	<option value="disable">Select Price</option>
                    <option value="1">$500-1000</option>
                    <option value="1">$1000-1500</option>
                    <option value="1">$1500-2000</option>
                    <option value="1">$2000-2500</option>
                    <option value="1">$2500-3000</option>
</select>
&#13;
&#13;
&#13;

我创建php自定义数组和代码如下所示得到如上所述的下拉菜单,但我没有得到像我想要的结果,任何人都能解决这个问题吗? 提前致谢? 我的想法是稍后在过滤中使用元查询。

&#13;
&#13;
<?php
                 $filterPrice = array(
                    array(
                    'maximum_price' => '1000','1500','2000','2500','3000',
                    'minimum_price'=> '500','1000','1500','2000','2500',
                    ));
                ?>
            <li class="filter">
                <span class="selector">
                <select name="price" class="filterSelectBox">
			         <option value="disable"><?php _e("Select price","um_lang"); ?></option>
                <?php 
                    foreach($filterPrice as $price):
                ?>
                   
                    <option value="<?php echo $price['minimum_price'].'-'.$price['maximum_price'] ?>"><?php echo $price['minimum_price'].'-'.$price['maximum_price'] ?></option>
                   
                <?php 
               
                endforeach;
                ?>
                </select>  
                </span>
            </li>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

源数组看起来很奇怪,但我认为这会产生一个你想要的菜单。

$filterPrice = array(
    'maximum_price' =>  array('1000','1500','2000','2500','3000'),
    'minimum_price' =>  array('500','1000','1500','2000','2500')
);

$maxprices=$filterPrice['maximum_price'];
$minprices=$filterPrice['minimum_price'];

$html=array('<select name="price" class="filterSelectBox">');
foreach( $maxprices as $index => $max ){
    $min = $minprices[ $index ];
    $value = $min . '-' . $max;
    $html[]="<option value='{$value}'>{$value}";
}
$html[]='</select>';


echo implode( PHP_EOL, $html );

如果我理解正确,那么你需要javascript来处理菜单中的选定选项并发送一个我认为的ajax请求。虽然说实话,我并不完全确定我理解你的确切要求。

您可以为每个选项分配dataset个属性,然后使用javascript来使用这些值。例如,如果您将上面的行更改为此

$html[]="<option value='{$value}' data-min=$min data-max=$max>{$value}";

然后添加了一个像这样的简单的javascript函数

$html[]="
<script type='text/javascript'>
    document.querySelectorAll('select[name=\"price\"]')[0].addEventListener('change',function(e){
        var selected=e.target.options[ e.target.options.selectedIndex ];
        console.info( 'use these values for filtering: %s, %s', selected.dataset.min, selected.dataset.max );
    },false);
</script>";

通过数据集属性可以获得单个最小值和最大值。希望这有点帮助。

答案 1 :(得分:0)

这部分很奇怪:

 $filterPrice = array(
    array(
      'maximum_price' => '1000','1500','2000','2500','3000',
      'minimum_price'=> '500','1000','1500','2000','2500',
  ));

将其更改为:

 $filterPrice = array(
      'maximum_price' => array('1000','1500','2000','2500','3000'),
      'minimum_price' => array('500','1000','1500','2000','2500'),
 );

//.....
foreach($filterPrice['maximum_price'] as $index=>$max_price){
    $min_price = $filterPrice['minimum_price'][$index];
    echo "<option value=".$min_price.'-'.$max_price.">".$min_price.'-'.$max_price."</option>";
}
//....

提交后:

//... 
$filter = $_POST['price']; 
list($price_from,$price_to) = explode('-',$filter);
//... using $price_from & $price_to for filtering
//... 
$args = array(
   'meta_query' => array(
        'key'     => 'price', // <- meta_key name for prices
        'value'   => array( $price_from, $price_to ),
        'type'    => 'numeric',
        'compare' => 'BETWEEN',
    ),
   // ... others query-params
);  

$q = new WP_Query( $args );
//.... 

详细了解WP_Query