양식 내부의 양식, 괜찮습니까?

양식 내부의 양식, 괜찮습니까? [복제]

---

이 질문에는 이미 답변이 있습니다.

• HTML 양식을 중첩 할 수 있습니까? 답변 21 개

다른 양식 안에 양식을 가질 수 있는지 여부 그것에 문제가 있습니까?

---

<form>하나의 HTML 페이지에 여러 요소를 가질 수 있지만 중첩 할 수는 없습니다.

---

새로운 HTML5 입력 요소의 양식 속성으로 양식 중첩을 수행 할 수 있습니다. 양식을 구조적으로 중첩하지는 않지만 입력은 자체 양식으로 평가됩니다. 내 테스트에서 IE (IE11)를 제외한 3 개의 주요 브라우저가 이것을 지원합니다. 양식 중첩 제한은 HTML UI 디자인에 큰 장애물이었습니다.

다음은 샘플 코드입니다. 저장 버튼을 클릭하면 "2 3 성공"(원본 http://www.impressivewebs.com/html5-form-attribute/ )이 표시됩니다.

<form id="saveForm" action="/post/dispatch/save" method="post"></form>
<form id="deleteForm" action="/post/dispatch/delete" method="post"></form>

<div id="toolbar">
    <input type="text" name="foo" form="saveForm" />
    <input type="hidden" value="some_id" form="deleteForm" />
    <input type="text" name="foo2" id="foo2" form="saveForm" value="success" />

    <input type="submit" name="save" value="Save" form="saveForm" onclick="alert(document.getElementById('deleteForm').elements.length + ' ' + document.getElementById('saveForm').elements.length + ' ' + document.getElementById('saveForm').elements['foo2'].value);return false;" />
    <input type="submit" name="delete" value="Delete" form="deleteForm" />
    <a href="/home/index">Cancel</a>
</div>

---

아니요. HTML은 중첩 된 양식을 명시 적으로 금지합니다.

로부터 HTML 5 초안 :

컨텐츠 모델 : 플로우 컨텐츠이지만 양식 요소 하위는 없습니다.

로부터 HTML 4.01 추천 :

<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- interactive form -->

(-(FORM) 섹션에 유의하십시오).

---

중첩 양식은 지원되지 않으며 w3c 표준의 일부가 아닙니다 (많은 사람들이 언급했듯이).

그러나 HTML5는 어떤 양식의 자손 일 필요는 없지만 "form"속성을 사용하여 여러 양식으로 제출할 수있는 입력에 대한 지원을 추가합니다. 이것은 정확히 중첩 양식을 허용하지 않지만이 방법을 사용하면 중첩 양식을 시뮬레이션 할 수 있습니다.

"form"속성의 값은 양식의 id이거나 여러 양식의 경우 양식 ID를 공백으로 분리해야합니다.

자세한 내용은 여기를 참조 하십시오

---

마스터 양식이 있고 "양식이있는 양식"이 있어야하는 경우 여기에 수행 할 수있는 작업은 다음과 같습니다. 필자의 경우 globalHeader에 링크가 있고 클릭했을 때 게시물을 수행하고 싶었습니다.

링크 버튼 제출이 포함 된 예제 양식 게시물 :

양식 대신 ... 입력을 div로 래핑하십시오.

 <div id="gap_form"><input type="hidden" name="PostVar"/><a id="myLink" href="javascript:Form2.submit()">A Link</a></div>

js 파일 :

$(document).ready(function () {
(function () {
    $('#gap_form').wrap('<form id="Form2" action="http://sitetopostto.com/postpage" method="post" target="_blank"></form>');
})();});

이것은 div "gap_form"안에있는 모든 것을 즉시 양식 안에 넣을 것이고 링크는 그 양식을 제출할 것입니다. 나는 지금 페이지 에서이 정확한 예제를 가지고 있습니다 ... (내 예제에서는 ... 새 페이지로 리디렉션하고 해당 페이지에 양식을 제출하면 같은 일을 할 수 있지만 ...

---

그렇습니다. 그건 잘못 됐어. 잘못되어 작동하지 않습니다. 대부분의 브라우저에는 하나의 양식 만 표시됩니다.

http://www.w3.org/MarkUp/html3/forms.html

---

다른 해결 방법은 자체 양식을 포함하는 모달 창을 시작하는 것입니다

---

중첩 된 양식이 있어야 유효한 XHTML이 아닙니다. 그러나 여러 제출 단추를 사용하고 서버 측 스크립트를 사용하여 사용자가 클릭 한 단추에 따라 다른 코드를 실행할 수 있습니다.

---

아니요 우리는 이와 같은 다른 양식 안에 양식을 중첩시킬 수 없습니다

<form name='form1'>
      <form name='form2'>
            //some code here
      </form>
</form>

경우에 따라 작동하지만 범용 플랫폼에는 권장되지 않습니다. 단일 양식 내에서 많은 제출 단추를 사용할 수 있지만 중첩 양식을 적절하게 관리 할 수는 없습니다.

참고 URL : https://stackoverflow.com/questions/3430214/form-inside-a-form-is-that-alright