问题
(The question is at the bottom of this post)
Hello, I am following this tutorial.
I have made 3 boxes total, 1 with all the values and 2 to separate the values.
Like this picture shows :
This is my Jquery :
<script type="text/javascript">
$(document).ready(function() {
$("#and").click(function() {
$("#totalselect option:selected").each(function() {
$("#select-and").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
$(this).remove();
});
});
$("#removeand").click(function() {
$("#select-and option:selected").each(function() {
$("#totalselect").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
$(this).remove();
});
});
$("#or").click(function() {
$("#totalselect option:selected").each(function() {
$("#select-or").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
$(this).remove();
});
});
$("#removeor").click(function() {
$("#select-or option:selected").each(function() {
$("#totalselect").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
$(this).remove();
});
});
});
</script>
And this is my HTML :
<div id="mass_options">
<a href="JavaScript:void(0);" id="and">And</a>
<a href="JavaScript:void(0);" id="or">Or</a>
<select name="totalselect[]" id="totalselect" multiple size="5">
<?php foreach ($reasons as $r) { ?>
<option value="reason_<?php echo $r['reason_id'] ?>">Reason: <?php echo $r['reason'] ?></option>
<?php } ?>
<?php foreach ($options5 as $key => $value) { ?>
<option value="status_<?php echo $key ?>">Session Status: <?php echo $value ?></option>
<?php } ?>
<?php foreach ($info as $key => $value) { ?>
<option value="action_<?php echo $key ?>">Action: <?php echo $value ?></option>
<?php } ?>
</select>
</div>
<select name="and" id="select-and" multiple size="5" class="selectnew">
</select>
<select name="or" id="select-or" multiple size="5" class="selectnew">
</select>
<br>
<br>
<a href="JavaScript:void(0);" id="removeand">Remove And</a>
<a href="JavaScript:void(0);" id="removeor">Remove Or</a>
The issue
When I click Next it sends me to a page that just does a var_dump of all the post values, what I am noticing is what ever I add to the "and box" or the "or box" is not in the var_dump as a value. The only way I can get it to be submitted (when I click next) is actually highlighting the value in the "and box" or in the "or box". How can I have it so, if it is in either the "and box" or the "or box" that it is automatically selected for me to submit to my script without me having to highlight them?
The reason why I am doing it like this is so I can dynamically build a query with Where clauses being "AND" or "OR" so I can make emailing students a lot more dynamic rather then just cut and dry.
Any help would be great.
回答1:
In a native form submit you have to "highlight" your options. You know only selected options will be send in the post. You can select them with jQuery before sending data:
$("form *:submit").click(function() { /* choose a better selector for submit button */
$("#select-and options, #select-or options").attr("selected", true);
$(this).parents("form:first").submit();
});
Another alternative without "autoselect" is to send the post with AJAX. In this way you can prepare your sending data.
..or edit your jQuery to this:
<script type="text/javascript">
$(document).ready(function() {
$("#and").click(function() {
$("#totalselect option:selected").appendTo("#select-and");
});
$("#or").click(function() {
$("#totalselect option:selected").appendTo("#select-or");
});
$("#removeand").click(function() {
$("#select-and option:selected")
.removeAttr("selected")
.appendTo("#totalselect");
});
$("#removeor").click(function() {
$("#select-or option:selected")
.removeAttr("selected")
.appendTo("#totalselect");
});
});
</script>
来源：https://stackoverflow.com/questions/16377718/add-remove-select-box-not-giving-values