Submit form on select (using Drupal)
I can't work this out for the life of me. Using Drupal and have a form that I'd like to submit once the user has selected one option. HTML is
<form id="people-blockform" method="post" accept-charset="UTF-8" action="/people">
<div>
<div id="edit-filter-wrapper" class="form-item">
<label开发者_开发问答 for="edit-filter">Filter: </label>
<select id="edit-filter" class="form-select" name="filter">
<optgroup label="label1">
<option value="all">Everyone</option>
<option value="option1">option1</option>
<option value="option2">option2</option>
</optgroup>
<optgroup label="Location">
<option value="loc1">loc1</option>
<option value="loc2">loc2</option>
</optgroup>
</select>
</div>
<input type="submit" class="form-submit" value="Filter" id="edit-submit" name="op">
<input type="hidden" value="form-ccd2e26e54becdc164411311ff397989" id="form-ccd2e26e54becdc164411311ff397989" name="form_build_id">
<input type="hidden" value="cb83794b5b00da15e546e12ec5499e64" id="edit-people-blockform-form-token" name="form_token">
<input type="hidden" value="people_blockform" id="edit-people-blockform" name="form_id">
</div>
</form>
and the jQuery I'm trying to use is this:
$(function () {
$("#edit-filter").live("change keyup", function () {
$("#people-blockform").submit();
});
});
Any help is greatly appreciated
This should work. If you put the below code into a file on it's own, it will work correctly:
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#edit-filter").live("change keyup", function () {
$("#people-blockform").submit();
});
});
</script>
</head>
<body>
<form id="people-blockform" method="post" accept-charset="UTF-8" action="test.php">
<div>
<div id="edit-filter-wrapper" class="form-item">
<label for="edit-filter">Filter: </label>
<select id="edit-filter" class="form-select" name="filter">
<optgroup label="label1">
<option value="all">Everyone</option>
<option value="option1">option1</option>
<option value="option2">option2</option>
</optgroup>
<optgroup label="Location">
<option value="loc1">loc1</option>
<option value="loc2">loc2</option>
</optgroup>
</select>
</div>
<input type="submit" class="form-submit" value="Filter" id="edit-submit" name="op">
<input type="hidden" value="form-ccd2e26e54becdc164411311ff397989" id="form-ccd2e26e54becdc164411311ff397989" name="form_build_id">
<input type="hidden" value="cb83794b5b00da15e546e12ec5499e64" id="edit-people-blockform-form-token" name="form_token">
<input type="hidden" value="people_blockform" id="edit-people-blockform" name="form_id">
</div>
</form>
</body>
</html>
Seeing as this works in isolation, it must be something else which is messing things up.
- What other forms do you have on the page?
- What other Javascript/jQuery do you have on the page?
- Are you sure that the jQuery you mentioned is being included properly?
- Are you using drupal_add_js() to include the requisite .js files, or another method?
Check your jQuery version. I have 1.2.6 on the D6.16 install I'm working on right now, but the .live handler wasn't added until 1.3 (http://api.jquery.com/live/). So your code returns "TypeError: Result of expression '$("#edit-field-servicegroup-value").live' [undefined] is not a function.".
加载中,请稍侯......
精彩评论