未从选择标记获取所选项目

时间:2017-09-27 09:59:45

标签: javascript php jquery

下面给出的代码片段是为了获取用户从下拉列表中选择的类代码和部分的值而编写的代码片段。 但我只得到选择的第一个元素,而不是获取所选元素。

Html代码:

<div id="dialog-form" title="Create New Academic Year">
            <p class="validateTips">All form fields are required.</p>
            <fieldset>

                <label for="class_code">Class</label>
                <select name="class_code" id="class_code" class="text ui-widget-content ui-corner-all">
                    <?php
                    include_once 'config.php';
                    $sql = "select class_code from list_class";
                    $result = $conn->query($sql);
                    while ($row = $result->fetch_assoc()) {
                        ?>
                        <option value="<?php echo $row['class_code'] ?>"><?php echo $row['class_code'] ?></option>
                        <?php
                    }
                    ?>
                </select>
                <label for="section">Section</label>
                <select name="section" id="section" class="text ui-widget-content ui-corner-all" multiple>
                    <?php
                    include_once 'config.php';
                    $sql = "select section_code from list_sections";
                    $result = $conn->query($sql);
                    while ($row = $result->fetch_assoc()) {
                        ?>
                        <option value="<?php echo $row['section_code'] ?>"><?php echo $row['section_code'] ?></option>
                        <?php
                    }
                    ?>
                </select>
            </fieldset>
        </div>

Js代码:

var new_dialog = function (type, row) {
        var dlg = $("#dialog-form").clone();
        type = type || 'Create';
        var config = {
            autoOpen: true,
            height: 300,
            width: 350,
            modal: true,
            buttons: {
                "Insert": function () {
                    //To get the class_code value
                    alert($('select[name="class_code"]').val());
                    //To get the section value
                    alert($('select[name="section"]').val());

                },
                "Cancel": function () {
                    dlg.dialog("close");
                }
            },
            close: function () {
                dlg.remove();
            }
        };
        dlg.dialog(config);
    };
    $("#create-user").button().click(new_dialog);

我甚至尝试过

alert($('#class_code option:selected')val());

但即使这样也行不通。 有人可以帮我解决我出错的地方。 提前谢谢。

2 个答案:

答案 0 :(得分:2)

您不必选择所选的选项 - 您只需选择自己的选择框

alert($('#class_code').val());

在你的情况下,还有一个问题。您克隆了表单,因此每个选择框在dom中存在多次,val()仅返回第一个选择框的选定值,这是列表中的第一个元素。

你必须选择 - 摆脱克隆或尝试类似的东西

alert($('select[name="class_code"]', dlg).val());

将dlg添加到上下文中使得jquery搜索克隆元素,应该解决什么问题

答案 1 :(得分:0)

正如我所看到的那样,你试图获得多个选定值的选择没有&#34;多个&#34;属性。

请看这里:

<select name="class_code" id="class_code" class="text ui-widget-content ui-corner-all">
                    <?php
                    include_once 'config.php';
                    $sql = "select class_code from list_class";
                    $result = $conn->query($sql);
                    while ($row = $result->fetch_assoc()) {
                        ?>
                        <option value="<?php echo $row['class_code'] ?>"><?php echo $row['class_code'] ?></option>
                        <?php
                    }
                    ?>
</select>

尝试添加&#34;多个&#34;这里:

<select name="class_code" id="class_code" class="text ui-widget-content ui-corner-all" multiple>
               //ur code
</select>