Change Search field with a select option

[Matteo]

Hi, please i’m trying to change the default serch field and city search fild with a select.
I have this two query for my db:
SELECT post_title FROM wp_posts WHERE post_type = 'tribe_events'GROUP BY post_title
for the event title and
SELECT meta_value FROM plkt_postmeta WHERE meta_key = '_venueCity'GROUP BY meta_value
for the City.
I need (a customer is asking this) to have two select with options populated from this two queries.
I’m working on the-events-calendar-class.php at line 4475:

if ( tribe_get_option( 'tribeDisableTribeBar', false ) == false ) {
  $filters['tribe-bar-search'] = array(
		'name'    => 'tribe-bar-search',
		'caption' => __( 'Search', 'tribe-events-calendar' ),
		'html'    => '<input type="text" name="tribe-bar-search" id="tribe-bar-search" value="' . $value . '" placeholder="' . __( 'Search', 'tribe-events-calendar' ) . '">'
				);
			}

and on tribe-geoloc.class.php at about line 263:

$filters['tribe-bar-geoloc'] = array(
	'name'    => 'tribe-bar-geoloc',
	'caption' => __( 'Near', 'tribe-events-calendar-pro' ),
	'html'    => '<input type="hidden" name="tribe-bar-geoloc-lat" id="tribe-bar-geoloc-lat" value="' . esc_attr( $lat ) . '" /><input type="hidden" name="tribe-bar-geoloc-lng" id="tribe-bar-geoloc-lng" value="' . esc_attr( $lng ) . '" /><input type="text" class="luogo" name="tribe-bar-geoloc" id="tribe-bar-geoloc" value="" placeholder="' . __( 'Location', 'tribe-events-calendar-pro' ) . '"><select id="tribe-luogo" name="tribe-bar-geoloc"><option value="Milano">Milano</option><option value="Roma">Roma</option></select>'
				);

But i can’t figure out how to make those ‘html’ in the array to become a select populated with my query.
I can manually create the select and put my values, but i need them to be updated from database.
Can you help please?
Best regards.

[Barry]

Hi!

The first thing I want to point out is that we would never advise you modify core plugin code – apart from the risk of introducing breakages, it makes for more a cumbersome upgrade process in the future 🙂

There is actually a filter you can use for this purpose: tribe-events-bar-filters. You can then simply override the html element of each filter with your custom select element. A very basic example being:

add_filter( 'tribe-events-bar-filters', 'replace_filter_html' );

function replace_filter_html( $filters ) {
    foreach ( $filters as &$individual_filter ) 
        $individual_filter['html'] = '<select ... >';
}

You could of course check the value of $individual_filter[‘name’] to make sure it’s one of the ones you are interested in changing – thus leaving the others untouched.

I hope that helps 🙂

[Matteo]

Hi, thanks for quick reply 🙂
I tried that piece of code in the theme-child (Enfold) function.php, but i get an empty serch bar…
Is this line correct? foreach ( $filters as &$individual_filter ) There’s an ampersand just before the $individual_filter variable. I tried with & and wothout & with the same result.
Anyway i can build a select with my custom values as you can see here:
http://www.siamocreativi.it/palketto/eventi/
(the original #tribe-bar-geoloc is hidden and updated via jQuery)
what i can’t do is to is to populate my select options querying the database:
e.g.:

function selezionaSpettacolo() {
    $dbconn = new mysqli ('localhost','name','password','database');
    if (!$spettacolo = $dbconn->query("SELECT post_title 
		                       FROM plkt_posts 
				       WHERE post_type = 'tribe_events'
				       GROUP BY post_title")) {
	exit('<p>Errore nella lettura del database</<p>');
	}
	while ($row = $spettacolo->fetch_assoc()) {
			$nomespettacolo = htmlspecialchars($row['post_title']);
			echo "<option value=''>$nomespettacolo</option>\n";
		}
	}
.........
$filters['tribe-bar-geoloc'] = array(
		'name'    => 'tribe-bar-geoloc',
		'caption' => __( 'Near', 'tribe-events-calendar-pro' ),
		'html'    => '<input type="hidden" name="tribe-bar-geoloc-lat" id="tribe-bar-geoloc-lat" value="' . esc_attr( $lat ) . '" /><input type="hidden" name="tribe-bar-geoloc-lng" id="tribe-bar-geoloc-lng" value="' . esc_attr( $lng ) . '" /><input type="hidden" class="luogo" name="tribe-bar-geoloc" id="tribe-bar-geoloc" value="" placeholder="' . __( 'Location', 'tribe-events-calendar-pro' ) . '"><select id="myselect">' . selezionaSpettacolo() . '</select>'');

If I try this way(i guess i need a more secure way to connect to db…), the options filds are displayed outside the select, inside the #tribe-events-content-wrapper like:

<div class="tribe-clearfix" id="tribe-events-content-wrapper"><input type="hidden" value="" id="tribe-events-list-hash">
<!-- Tribe Bar -->

<option value="">AN IDEAL HUSBAND</option>
<option value="">Cicoria</option>
<option value="">EL PERRO DEL HORTELANO</option>
<option value="">FAME Jr: the musical</option>
<option value="">LE COMTE DE MONTECRISTO</option>
<option value="">LE PETIT PRINCE</option>
<option value="">SHREK</option>

<div id="tribe-events-bar">

Sorry 🙂 Php is not one of my must (I’m better with Html and jQuery).
Thanks a lot for your time.
Best regards.

[Barry]

Hi Matteo,

Yes that was correct – the ampersand is perfectly legal PHP – it just means I was using a reference.

It was however an incomplete example and all I wanted to do was show the basic approach for using that filter hook, the final implementation is something you will need to write 🙂

I’m afraid though because this is customization territory it’s not something where we are going to be able to help further. Please also note that WordPress itself provides facilities to let you communicate with the database, avoiding any need for you to establish a separate connection.

As we can’t assist further on this occasion though I’ll go ahead and close this topic – I do wish you luck with the customization, though 🙂

Beyond

[Author]

Posts