Select 태그의 옵션이 여러 값을 가질 수 있습니까?

Select 태그의 옵션이 여러 값을 가질 수 있습니까?

---

HTML 형식의 몇 가지 옵션이있는 선택 태그가 있습니다.
(데이터는 PHP를 사용하여 수집 및 처리됩니다.)

테스트 :

<SELECT NAME="Testing">  
  <OPTION VALUE="1"> One  
  <OPTION VALUE="2"> Two  
  <OPTION VALUE="3"> Three
</SELECT>

사용자가 "하나"를 선택한 경우와 같이 옵션이 여러 값을 전달할 수 있습니까? 그러면이 옵션과 관련된 몇 가지 다른 값이 데이터베이스에 기록됩니다.

SELECT각 옵션이 다음과 같이 하나 이상의 값을 전달할 수 있도록 태그를 어떻게 디자인해야합니까?

<SELECT NAME="Testing">  
  <OPTION VALUE="1" value="2010"> One  
  <OPTION VALUE="2" value="2122"> Two  
  <OPTION VALUE="3" value="0"> Three
</SELECT>

---

이를 수행하는 한 가지 방법은 첫 번째는 배열이고 두 번째는 객체입니다.

    <select name="">
        <option value="{'num_sequence':[0,1,2,3]}">Option one</option>
        <option value="{'foo':'bar','one':'two'}">Option two</option>
    </select>

JSON.stringify()내 개념 증명 답변이 "초보 개발자를 혼동 할 수있다"는 불만 때문에 두 값을 JSON 형식 (사용 ) 으로 입력하도록 편집 (답변 3 년 후)되었습니다 .

---

나는 실제로 오늘 이것을 궁금해했고, 다음과 같이 php explode 함수를 사용하여 달성했습니다.

HTML 양식 (파일에서 'doublevalue.php':

    <form name="car_form" method="post" action="doublevalue_action.php">
            <select name="car" id="car">
                    <option value="">Select Car</option>
                    <option value="BMW|Red">Red BMW</option>
                    <option value="Mercedes|Black">Black Mercedes</option>
            </select>
            <input type="submit" name="submit" id="submit" value="submit">
    </form>

PHP 액션 (내가 doublevalue_action.php라는 파일에서)

    <?php
            $result = $_POST['car'];
            $result_explode = explode('|', $result);
            echo "Model: ". $result_explode[0]."<br />";
            echo "Colour: ". $result_explode[1]."<br />";
    ?>

첫 번째 코드에서 볼 수 있듯이 두 가지 옵션이있는 표준 HTML 선택 상자를 만들고 있습니다. 각 옵션에는 값 (이 경우 모델 및 색상)을 분할하기위한 구분 기호 (이 경우 '|')가있는 1 개의 값이 있습니다.

작업 페이지에서 결과를 배열로 분해 한 다음 각각을 호출합니다. 보시다시피, 이로 인해 발생하는 효과를 볼 수 있도록 구분하고 레이블을 지정했습니다.

나는 이것이 누군가에게 도움이되기를 바랍니다 :)

---

아래와 같이 선택 옵션에 여러 값을 가질 수 있습니다.

<select id="ddlEmployee" class="form-control">
    <option value="">-- Select --</option>
    <option value="1" data-city="Washington" data-doj="20-06-2011">John</option>
    <option value="2" data-city="California" data-doj="10-05-2015">Clif</option>
    <option value="3" data-city="Delhi" data-doj="01-01-2008">Alexander</option>
</select>

아래와 같이 jquery를 사용하여 변경 이벤트에서 선택한 값을 얻을 수 있습니다.

$("#ddlEmployee").change(function () {
     alert($(this).find(':selected').data('city'));
});

이 링크 에서 자세한 내용을 찾을 수 있습니다.

---

한 가지 옵션은 쉼표로 구분 된 다중 값을 입력하는 것입니다.

처럼

value ="123,1234"

서버 측에서 분리하십시오.

---

When I need to do this, I make the other values data-values and then use js to assign them to a hidden input

<select id=select>
<option value=1 data-othervalue=2 data-someothervalue=3>
//...
</select>

<input type=hidden name=otherValue id=otherValue />
<input type=hidden name=someOtherValue id=someOtherValue />

<script>
$('#select').change(function () {
var otherValue=$(this).find('option:selected').attr('data-othervalue');
var someOtherValue=$(this).find('option:selected').attr('data-someothervalue');
$('#otherValue').val(otherValue);
$('#someOtherValue').val(someOtherValue);
});
</script>

---

If you're goal is to write this information to the database, then why do you need to have a primary value and 'related' values in the value attribute? Why not just send the primary value to the database and let the relational nature of the database take care of the rest.

If you need to have multiple values in your OPTIONs, try a delimiter that isn't very common:

<OPTION VALUE="1|2010">One</OPTION>

...

or add an object literal (JSON format):

<OPTION VALUE="{'primary':'1','secondary':'2010'}">One</OPTION>

...

It really depends on what you're trying to do.

---

put values for each options like

<SELECT NAME="val">
   <OPTION VALUE="1" value="1:2:3:4"> 1-4  
   <OPTION VALUE="2" value="5:6:7:8"> 5-8  
   <OPTION VALUE="3" value="9:10:11:12"> 9-12
</SELECT>

at server side in case of php, use functions like explode [array] = explode([delimeter],[posted value]);

$values = explode(':',$_POST['val']

the above code return an array have only the numbers and the ':' get removed

---

I did this by using data attributes. Is a lot cleaner than other methods attempting to explode etc.

HTML

<select class="example">
    <option value="1" data-value="A">One</option>
    <option value="2" data-value="B">Two</option>
    <option value="3" data-value="C">Three</option>
    <option value="4" data-value="D">Four</option>
</select>

JS

$('select.example').change(function() {

    var other_val = $('select.example option[value="' + $(this).val() + '"]').data('value');

    console.log(other_val);

});

---

Use a delimiter to separate the values.

<select name="myValues">
<option value="one|two">
</select>

<?php>
$value = filter_input(INPUT_POST, 'myValues');
$exploded_value = explode('|', $value);
$value_one = $exploded_value[0];
$value_two = $exploded_value[1];
?>

---

Duplicate tag parameters are not allowed in HTML. What you could do, is VALUE="1,2010". But you would have to parse the value on the server.

---

Instead of storing the options on the client-side, another way to do this is to store the options as sub-array elements of an associative/indexed array on the server-side. The values of the select tag would then just contain the keys used to dereference the sub-array.

Here is some example code. This is written in PHP since the OP mentioned PHP, but it can be adapted to whatever server-side language you are using:

<FORM action="" method="POST">
    <SELECT NAME="Testing">  
        <OPTION VALUE="1"> One </OPTION> 
        <OPTION VALUE="2"> Two </OPTION>
        <OPTION VALUE="3"> Three </OPTION>
    </SELECT>
</FORM>

PHP:

<?php
$options = array(
    1 => array('value1' => '1', 'value2' => '2010'),
    2 => array('value1' => '2', 'value2' => '2122'),
    3 => array('value1' => '3', 'value2' => '0'),
);
echo 'Selected option value 1: ' . $options[$_POST['Testing']]['value1'] . '<br>';
echo 'Selected option value 2: ' . $options[$_POST['Testing']]['value2'] . '<br>';

---

you can use multiple attribute

<SELECT NAME="Testing" multiple>  
 <OPTION VALUE="1"> One  
 <OPTION VALUE="2"> Two  
 <OPTION VALUE="3"> Three

참고URL : https://stackoverflow.com/questions/3245967/can-an-option-in-a-select-tag-carry-multiple-values