Получить идентификатор выбранной опции

У меня есть две формы диалога Add region и Add country. В каждой модальной форме есть варианты <select>. Могут быть варианты выбора, которые повторяются в каждой модальной форме, поэтому я помещаю их в класс и ставил его на display:none, поэтому идентификатор не повторяется.Получить идентификатор выбранной опции

Когда мне нужно получить идентификатор выбранного элемента, он дает мне неопределенное значение. Я использую $(".region_options").children(":selected").attr("id");, чтобы получить идентификатор выбранной опции.

Вот мой код. и jsFiddle

<!doctype html> 
<html lang="en"> 
<head> 

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 

    <script> 
    $(function() { 

    $("#dialog-form").dialog({ 
     autoOpen: false, 
     height: 300, 
     width: 350, 
     modal: true, 
     buttons: { 
     "Create an account": function() { 
      var region_id = $(".region_options").children(":selected").attr("id"); 
      alert(region_id) 
     }, 
     Cancel: function() { 
      $(this).dialog("close"); 
     } 
     }, 

    }); 

    $("#create-user").button().click(function() { 
     $("#dialog-form").dialog("open"); 
     }); 
    }); 


    </script> 
</head> 
<body> 

<div id="dialog-form" title="Create new user"> 
    <select class="region_options"> 
     <option>Select Region</option> 
     <option id="1">Asia/Pacific</option> 
     <option id="2">North America</option> 
     <option id="3">sdgvgwqrg</option> 
    </select> 
</div> 

<div id="dialog-form1" title="Create new user" style="display:none"> 
    <select class="region_options"> 
     <option>Select Region</option> 
     <option id="1">Asia/Pacific</option> 
     <option id="2">North America</option> 
     <option id="3">sdgvgwqrg</option> 
    </select> 
</div> 


<button id="create-user">Create new user</button> 


</body> 
</html>

источник

2013-12-20 PythonEnthusiast

<option> элементы обозначены атрибутом value, а не id.

<select class="region_options"> 
    <option>Select Region</option> 
    <option value="1">Asia/Pacific</option> 
    <option value="2">North America</option> 
    <option value="3">sdgvgwqrg</option> 
</select>

Используйте val() метод для чтения или записи значение выбранного параметра.

var region = $("#dialog-form .region_options").val(); 
$("#dialog-form1 .region_options").val(region);

источник

2013-12-20 07:35:13

Отличный ответ, но обратите внимание, что '$ (". Region_options ")' соответствует нескольким элементам. – Stefan

Все еще не работает. Вот http://jsfiddle.net/UGpZH/3/ – PythonEnthusiast

Он дает мне «Выбрать регион», я предпочитаю 1,2,3 по выбранному элементу. – PythonEnthusiast

Вам нужно изменить строку, которую вы используете от:

$(".region_options").children(":selected").attr("id");

к:

$(".region_options").children(":selected").parent().parent().attr("id")

Updated Fiddle

источник

2013-12-20 07:42:31

Он будет работать с идентификатором я работал над ваш js скриптит код javascript

`$(function() { 

    $("#dialog-form").dialog({ 
     autoOpen: false, 
     height: 300, 
     width: 350, 
     modal: true, 
     buttons: { 
     "Create an account": function() { 
      var region_id = $("#select_region").val(); 
      alert(region_id); 
     }, 
     Cancel: function() { 
      $(this).dialog("close"); 
     } 
     }, 

    }); 

    $("#create-user").button().click(function() { 
     $("#dialog-form").dialog("open"); 
     }); 
    });`

и HTML код будет:

<div id="dialog-form" title="Create new user"> 
    <select id="select_region" class="region_options"> 
     <option>Select Region</option> 
     <option value="1">Asia/Pacific</option> 
     <option value="2">North America</option> 
     <option value="3">sdgvgwqrg</option> 
    </select> 
</div> 

<div id="dialog-form1" title="Create new user" style="display:none"> 
    <select class="region_options"> 
     <option>Select Region</option> 
     <option value="1">Asia/Pacific</option> 
     <option value="2">North America</option> 
     <option value="3">sdgvgwqrg</option> 
    </select> 
</div> 


<button id="create-user">Create new user</button>

использовать идентификатор как атрибут несмотря на использование класса <select id="select_region" class="region_options">

источник

2013-12-20 07:44:51 shams

Как this относится к модальным (ваш #dialog-form элемент) мы можем выбрать элемент select внутри него, а не все из них.

$(function() { 

    $("#dialog-form").dialog({ 
     autoOpen: false, 
     height: 300, 
     width: 350, 
     modal: true, 
     buttons: { 
     "Create an account": function() { 

      var region_id = $(this).find(".region_options").val(); // Solution 

      if (!region_id) 
      alert('Please select a region.'); 
      else 
      alert('Selected region: ' + region_id); 
     }, 
     "Cancel": function() { 
      $(this).dialog("close"); 
     } 
     } 
    }); 

    $("#create-user").button().click(function() { 
     $("#dialog-form").dialog("open"); 
     }); 

    });

См val и find.

источник

2013-12-20 07:47:46 Stefan

Вам не нужно менять разметку или использовать функцию .val. Вы можете получить идентификаторы так:

$(function() { 

    $("#dialog-form").dialog({ 
    autoOpen: false, 
    height: 300, 
    width: 350, 
    modal: true, 
    buttons: { 
     "Create an account": function() { 
      var region_id = $(this).find(".region_options option:selected").attr("id"); 
      alert(region_id); 
     }, 
     Cancel: function() { 
     $(this).dialog("close"); 
     } 
    }, 

    }); 

    $("#create-user").button().click(function() { 
     $("#dialog-form").dialog("open"); 
    }); 
});

Вот ваше jsfiddle обновления:

http://jsfiddle.net/UGpZH/13/

Проблема заключается в том, что вы выбираете неправильные раскрывающийся.

источник

2013-12-20 07:49:28 Krasimir

Получить идентификатор выбранной опции

ответ

Смежные вопросы