JCHASE11
JCHASE11

Reputation: 3941

Submit Form dropdown with jQuery

I am using a dropdown plugin called dropkick, which replaces select menus with better looking, custom dropdowns. I want to display my list of WordPress categories in this dropdown. Here is the PHP code that generates the dropdown:

<form action="<?php bloginfo('url'); ?>/" method="get" class="pretty">
    <?php $select = wp_dropdown_categories('show_option_none=Select category&show_count=1&orderby=name&echo=0');
    echo $select; ?>
</form>

The JavaScript code to turn this into a "pretty dropdown" is as follows.

$('.pretty select').dropkick({
      theme: 'default',
      change: function (value, label) {
         INSERT CALLBACK HERE
      }
});

I need to write a callback that will submit the form after the user selects a category. How would I go about this?

I tried using return this.form.submit() and also return $(this).parent().form.submit() but that did not submit the form. How can I auto submit a form using jQuery?

The form action and method are already defined in the form.

Upvotes: 1

Views: 1745

Answers (2)

Nick George
Nick George

Reputation: 326

Christofer Eliasson's answer may be correct, but just in case you have more than one form, this would be better:

$(this).closest('form').submit();

Upvotes: 3

Christofer Eliasson
Christofer Eliasson

Reputation: 33865

You can use jQuery's .submit() to post the form.

Given that you only have one form in the DOM with the class pretty, you could post the form like this:

$("form.pretty").submit();

Upvotes: 0

Related Questions