Submit wordpress form if selected value changes without button

7 Views

I’m trying to submit a form without a submit button.
This form takes values from custom fields in wordpress, displaying results in another page. I’ve been trying with the usual javascript function onchange and nothing happens, I’ve tried with functions as well…does anyone know what’s wrong with this or if is there a better way to solve it? Can it be something related to WordPress, or the post method? This is the code for the form: 

<form method="get" name="form" action="/busqueda/" >
        <div class="search">

            <select class="styled" name="author"  onChange="this.form.submit();">
            <option value="-1" selected>Authors</option>    
            <?php
            $metakey = 'author';
            $autores = $wpdb->get_col($wpdb->prepare("SELECT DISTINCT meta_value FROM $wpdb->postmeta WHERE meta_key = %s ORDER BY meta_value ASC", $metakey) );
            if ($authors) {
            foreach ($authors as $author) {
            echo "<option VALUE="" . $author . "">" . $author . "</option>";
                                    }
                            }
                ?>
            </select>
        </div><!-- #search1 -->

</form>

BTW, the form works fine when displaying results with a standard submit button.
Any hint of what can be wrong is welcome. Thanks a lot!

Post Views: 7

Related posts

Leave a Reply

2 comments

  1. Try this one:

    <form method="get" name="form" action="/busqueda/" >
        <div class="search">

            <select class="styled" name="author" onChange="document.forms['form'].submit();">

            <?php
            $metakey = 'author';
            $autores = $wpdb->get_col($wpdb->prepare("SELECT DISTINCT meta_value FROM $wpdb->postmeta WHERE meta_key = %s ORDER BY meta_value ASC", $metakey) );
            if ($authors) {
            foreach ($authors as $author) {
            echo "<option VALUE="" . $author . "">" . $author . "</option>";
                                    }
                            }
                ?>
            </select>
        </div><!-- #search1 -->

</form>

    Updated with jQuery submit

    The updated form:

    <form id="authorForm" method="get" name="form" action="/busqueda/" >
        <div class="search">

            <select id="author" class="styled" name="author">
                <option value="default">Choose an author...</option>
                <?php
                $metakey = 'author';
                $autores = $wpdb->get_col($wpdb->prepare("SELECT DISTINCT meta_value FROM $wpdb->postmeta WHERE meta_key = %s ORDER BY meta_value ASC", $metakey) );
                if ($authors){
                    foreach ($authors as $author) {
                        echo '<option value="' . $author . '">' . $author . '</option>';
                    }
                }
                ?>
            </select>
        </div><!-- #search1 -->

</form>

    jQuery script change event handling and form submit:

    <script type="text/javascript">
$(document).ready(function(){
    $('#author').change(function(){
        if($(this).val() !== 'default'){
            $('#authorForm').submit();
        }
    }); 
});
</script>

    You can test the jQuery from submit on drop box change event

  2. I hope you are retrieving the value after the post correctly through $_GET because when i ran the code in my browser, the value is passing on in the URL quite nicely. Check your retrieval code make sure you are using $_GET and not $_POST.