다른 HTML 양식 내에 HTML 양식을 갖는 것이 유효합니까?

StackOverflow https://stackoverflow.com/questions/555928

문제

다음을 갖는 것이 유효한 HTML입니까?

<form action="a">
    <input.../>
    <form action="b">
        <input.../>
        <input.../>
        <input.../>
    </form>
    <input.../>
</form>

따라서 "B"를 제출하면 내부 형태의 필드 만 얻습니다. "A"를 제출하면 모든 필드를 "B"내에서 뺀 필드를 얻습니다.

가능하지 않으면이 상황에 대한 해결 방법을 사용할 수 있습니까?

도움이 되었습니까?

해결책

ㅏ. 유효한 HTML 또는 XHTML이 아닙니다

공식적인 W3C XHTML 사양에서 섹션 B. "요소 금지"는 다음을 설명합니다.

"form must not contain other form elements."

http://www.w3.org/tr/xhtml1/#prohibitions

나이든 HTML 3.2 사양, 양식 요소의 섹션은 다음을 나타냅니다.

"모든 양식은 양식 요소 내에 둘러싸여 있어야합니다. 단일 문서에는 여러 양식이있을 수 있지만 양식 요소를 중첩 할 수는 없습니다."

비. 해결 방법

태그 양식을 둥지없이 JavaScript를 사용하는 해결 방법이 있습니다.

"중첩 된 양식을 만드는 방법." (제목에도 불구하고 이것은입니다 ~ 아니다 중첩 된 양식 태그이지만 JavaScript 해결 방법).

이 stackoverflow 질문에 대한 답변

메모: 스크립팅을 통해 DOM을 조작하여 W3C 유효성 검사기가 페이지를 전달하도록 속일 수 있지만 여전히 합법적 인 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는 다음과 같습니다.

  1. 숨겨진 필드 및 JavaScript 만있는 추가 양식을 사용하여 입력을 설정하고 양식을 제출하십시오.
  2. CSS를 사용하여 여러 HTML 양식을 구성하여 단일 엔티티처럼 보이지만 너무 어렵다고 생각합니다.

다른 사람들이 말했듯이, 그것은 유효한 HTML이 아닙니다.

양식을 서로 시각적으로 배치하기 위해이 작업을 수행하는 것처럼 들립니다. 이 경우 두 가지 별도 양식을 수행하고 CSS를 사용하여 배치하십시오.

아니요, HTML 사양은 다음과 같습니다 FORM 요소는 다른 요소를 포함해야합니다 FORM 요소.

양식의 동작 속성 내부에서 사용자 정의 자바 스크립트 메드를 사용하십시오!

예를 들어

<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 유효성 검사기. (텍스트 입력 필드가 특징이므로 코드를 서버에 넣을 필요조차 없습니다 ...)

(그리고 아니, 그것은 검증되지 않습니다.)

가능성은 외부 형태 안에 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 관계형 데이터베이스에 데이터를 제출/커밋하기 위해 양식이 필요한 경우 표 B에 필요한 데이터를 삽입하는 "After Insert"DB 트리거를 작성하는 것이 좋습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top