2017-09-27 85 views
0

下面給出了我編寫的用於從下拉菜單中獲取用戶選擇的類代碼和部分值的代碼片段。 但我只獲得了選擇的第一個元素,而不是獲取所選元素。未從選擇標記中獲取所選項目

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()); 

但是,即使這沒有奏效。 有人可以幫我解決我哪裏出錯的地方。 在此先感謝。

+0

你想從下拉選中右邊的值? – Sand

+0

是的,我想要選擇的值 –

+0

您想將該值發送給PHP嗎? – Sand

回答

2

你不必選擇所選選項 - 你只需要選擇選擇框本身

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

在你的情況,有一個更多的問題。您克隆了表單,因此每個選擇框在dom中都存在多次,並且val()僅返回第一個選擇框的選定值,該選擇框是列表中的第一個元素。

你必須選擇 - 擺脫克隆或嘗試這樣的事情

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

添加DLG上下文使得克隆的元素中jQuery的搜索,我們應該解決您的問題

+0

仍只獲得第一個元素。 –

+0

你是否舒服,只有一個ID爲'class_code'的元素?我提供的代碼應該返回選定的選項值 – Philipp

+0

是的。此ID不存在其他元素。 –

0

正如我我看到您正在嘗試獲取多個選定值的選擇不具有「多個」屬性。

請看這裏:

<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> 

嘗試加入 「多」 在這裏:

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

添加多個給我「空」作爲輸出 –