I have a dropdown on home page whose value i want to use in a function in functions.php How should i proceed i have no idea. This is the code i am using
<form action="single-product.php" method="POST">
<select name="selected-country" id="country-opt">
<option selected="true" disabled="disabled">Choose Your Country</option>
<?php
$args = array( 'post_type' => 'product',
'posts_per_page' => 4,
);
$loop = new WP_Query( $args );
if($loop->have_posts()):while($loop->have_posts()):$loop->the_post();
$term = wp_get_post_terms($post->ID,'product_cat');
?>
<option value="<?php echo $term[0]->name; ?>" href="<?php the_permalink();?>"><?php echo $term[0]->name; ?></option>
<?php
endwhile;
endif;
?>
</select>
</form>
<a id="submit-btn" href="">Submit</a>
<script>
document.getElementById("country-opt").onchange = function() {
if (this.selectedIndex!==0) {
document.getElementById("submit-btn").href=this.children[this.selectedIndex].getAttribute('href');
}
};
</script>
You could add it to the URI and pass it from the option value like this
<option value="<?php echo $term[0]->name; ?>" href="<?php the_permalink() . '?t=' . $term[0]->name; ?>"><?php echo $term[0]->name; ?></option>
If sessions work in your WordPress - @kaiser has pointed out that they don't, though they have worked for me to solve a similar problem in the past, you could use $_SESSION['my-selected-country'] = $_GET['t'];
to get it back.
or make $_SESSION['my-selected-country'] = $_POST['selected-country'];
By making it into a session variable it should then work as a global and be available in functions.php
.
The hidden input method below will work in either case whether sessions work or not. Thanks to @kaiser for the "heads-up".
If you add a submit button rather than using an <a href
you would be able to pick the value up in the target page. I think single-product.php
is actually a page part template so you might want to make a new page for your button to submit to rather than pointing to a template part.
That would mean you could make the value of selected-country
just the href you want, together with a query string and use that in the page you submit to by collecting it as a $_POST
PHP variable
<option value="href='<?php the_permalink() . '?t=' . $term[0]->name; ?>'><?php echo $term[0]->name; ?></option>
You could add a submit button or you could make the existing link a submit span:
<span id="submit-btn" onclick="submit_this();">Submit</span>
With a little JavaScript script in your header
function submit_this(){
document.form.submit();
}
add id="form"
to your form as well.
You could add an onchange
event to the dropdown
<select name="selected-country" id="country-opt" onchange="set_url(this.value)">
and using the last version above have a little onchange
script which says
function set_url(url_value){
document.getElementById('submit-btn').href = url_value;
}
Remember to define var url_value='';
in JavaScript your header or it will fail. All of the script bits should go in your header, or better, be enqueued and put into your functions.php
If you want the URI and the text value of $term[0]->name;
you would need to make a hidden input called - say option-text
<input type="hidden" id="option-text" name="option-text" />
and add to your onchange event function script
document.getElementById('option-text').value = this.innerHTML;
and pick that up as $_POST['option-text'];
Using JavaScript to send values to a hidden input in this way is very commonly used to transfer values from JavaScript to PHP.
As you will be picking up submitted variables it is essential to ensure that they are cleaned up and escaped to prevent inject attack.