[html] 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"서버 측에서 분리하십시오.
답변
이 작업을 수행해야 할 때 다른 값 데이터 값을 만든 다음 js를 사용하여 숨겨진 입력에 할당합니다.
<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>답변
이 정보를 데이터베이스에 쓰는 것이 목표라면 왜 value속성에 기본 값과 ‘관련’값이 있어야 합니까? 기본 값을 데이터베이스에 보내고 데이터베이스의 관계형 특성이 나머지를 처리하도록하는 것이 어떻습니까?
에 여러 값이 있어야하는 경우 OPTION흔하지 않은 구분 기호를 사용해보십시오.
<OPTION VALUE="1|2010">One</OPTION>…
또는 객체 리터럴 (JSON 형식)을 추가합니다.
<OPTION VALUE="{'primary':'1','secondary':'2010'}">One</OPTION>…
그것은 당신이하려는 일에 달려 있습니다.
답변
각 옵션에 대한 값을 입력하십시오.
<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>PHP의 경우 서버 측에서 explode
[array] = explode ([delimeter], [posted value]);
$values = explode(':',$_POST['val']위의 코드는 숫자 만있는 배열을 반환하고 ‘:’가 제거됩니다.
