다른 html 양식 안에 html 양식을 갖는 것이 유효합니까?
유효한 HTML은 다음과 같습니다.
<form action="a">
<input.../>
<form action="b">
<input.../>
<input.../>
<input.../>
</form>
<input.../>
</form>
따라서 "b"를 제출하면 내부 양식 내의 필드 만 가져옵니다. "a"를 제출하면 모든 필드에서 "b"내의 필드를 뺀 것입니다.
가능하지 않은 경우이 상황에 대한 해결 방법은 무엇입니까?
A. 유효한 HTML이나 XHTML이 아닙니다.
공식 W3C XHTML 사양의 섹션 B. "요소 금지"에 다음과 같이 명시되어 있습니다.
"form must not contain other form elements."
http://www.w3.org/TR/xhtml1/#prohibitions
이전 HTML 3.2 사양 과 관련하여 FORMS 요소 섹션에는 다음이 설명되어 있습니다.
"모든 양식은 FORM 요소 내에 포함되어야합니다. 단일 문서에는 여러 양식이있을 수 있지만 FORM 요소는 중첩 될 수 없습니다."
B. 해결 방법
양식 태그를 중첩 할 필요없이 JavaScript를 사용하는 해결 방법이 있습니다.
"중첩 된 양식을 만드는 방법." (제목에도 불구하고이되어 있지 양식 태그를 중첩,하지만 자바 스크립트는 해결).
참고 : 스크립팅을 통해 DOM을 조작하여 W3C Validator가 페이지를 전달하도록 속일 수는 있지만 여전히 유효한 HTML은 아닙니다. 이러한 접근 방식을 사용할 때의 문제점은 이제 브라우저에서 코드의 동작이 보장되지 않는다는 것입니다. (표준이 아니기 때문에)
누군가 가이 게시물을 여기에서 발견하면 JS가 필요없는 훌륭한 솔루션입니다. 서버 언어에서 이름 속성 확인이 다른 두 개의 제출 단추를 사용하십시오. 제출 단추를 누르면 그 중 하나만 서버로 전송됩니다.
<form method="post" action="ServerFileToExecute.php">
<input type="submit" name="save" value="Click here to save" />
<input type="submit" name="delete" value="Click here to delete" />
</form>
PHP를 사용하면 서버 측은 다음과 같이 보일 수 있습니다.
<?php
if(isset($_POST['save']))
echo "Stored!";
else if(isset($_POST['delete']))
echo "Deleted!";
else
echo "Action is missing!";
?>
HTML 4.x 및 HTML5는 중첩 된 양식을 허용하지 않지만 HTML5는 "form"속성 ( "form owner")에 대한 해결 방법을 허용합니다.
HTML 4.x의 경우 다음을 수행 할 수 있습니다.
- 숨겨진 필드 및 JavaScript 만있는 추가 양식을 사용하여 입력을 설정하고 양식을 제출하십시오.
- CSS를 사용하여 단일 엔티티처럼 보이도록 여러 HTML 양식을 정렬하십시오. 그러나 너무 어렵다고 생각합니다.
다른 사람들이 말했듯이 유효한 HTML이 아닙니다.
양식을 서로 시각적으로 배치하기 위해이 작업을 수행하는 것처럼 들립니다. 이 경우 두 개의 별도 양식을 수행하고 CSS를 사용하여 배치하십시오.
아니요, HTML 사양에는 어떤 FORM요소도 다른 FORM요소를 포함 하지 않아야한다고 명시되어 있습니다 .
대신 양식의 action 속성 내에서 사용자 정의 javascript-method를 사용하십시오!
예 :
<html>
<head>
<script language="javascript" type="text/javascript">
var input1 = null;
var input2 = null;
function InitInputs() {
if (input1 == null) {
input1 = document.getElementById("input1");
}
if (input2 == null) {
input2 = document.getElementById("input2");
}
if (input1 == null) {
alert("input1 missing");
}
if (input2 == null) {
alert("input2 missing");
}
}
function myMethod1() {
InitInputs();
alert(input1.value + " " + input2.value);
}
function myMethod2() {
InitInputs();
alert(input1.value);
}
</script>
</head>
<body>
<form action="javascript:myMethod1();">
<input id="input1" type="text" />
<input id="input2" type="text" />
<input type="button" onclick="myMethod2()" value="myMethod2"/>
<input type="submit" value="myMethod1" />
</form>
</body>
</html>
HTML 코드를 W3 Validator 에 입력하면 자신의 질문에 매우 쉽게 대답 할 수 있습니다 . (텍스트 입력 필드가 있으므로 서버에 코드를 넣을 필요조차 없습니다 ...)
(아니요, 유효성을 검사하지 않습니다.)
외부 양식 안에 iframe이있을 수 있습니다. iframe에는 내부 양식이 포함되어 있습니다. <base target="_parent" />양식이 기본 페이지의 일부로 동작하도록 iframe의 헤드 태그 안에 태그 를 사용해야합니다 .
아니, w3c 참조
아니요, 유효하지 않습니다. 그러나 "솔루션"은 "b"형식을 포함하는 "a"형식 외부에 모달 창을 만들 수 있습니다.
<div id="myModalFormB" class="modal">
<form action="b">
<input.../>
<input.../>
<input.../>
<button type="submit">Save</button>
</form>
</div>
<form action="a">
<input.../>
<a href="#myModalFormB">Open modal b </a>
<input.../>
</form>
부트 스트랩을 사용하거나 CSS를 구체화하면 쉽게 수행 할 수 있습니다. iframe 사용을 피하기 위해이 작업을 수행하고 있습니다.
1 : M 관계형 데이터베이스에 데이터를 제출 / 커밋하는 양식이 필요한 경우 테이블 A에 필요한 데이터를 삽입하는 테이블 A에 "삽입 후"DB 트리거를 작성하는 것이 좋습니다.
참고 URL : https://stackoverflow.com/questions/555928/is-it-valid-to-have-a-html-form-inside-another-html-form
'development' 카테고리의 다른 글
| Makefile.am과 Makefile.in은 무엇입니까? (0) | 2020.03.11 |
|---|---|
| 메모장에서 CRLF 찾기 ++ (0) | 2020.03.11 |
| 경고 : 동일한 종속 어셈블리의 다른 버전간에 충돌이 발견되었습니다. (0) | 2020.03.11 |
| Google 웹 검색 API가 더 이상 사용되지 않는 대안은 무엇입니까? (0) | 2020.03.11 |
| 목록에서 요소의 모든 항목을 찾는 방법은 무엇입니까? (0) | 2020.03.11 |