나는과 같이 다른 형태로 내장 된 HTML 양식을 갖고 싶어 :<form> 안에 <form>을 삽입 하시겠습니까?
<form id="form1">
<input name="val1"/>
<form id="form2">
<input name="val2"/>
<input type="button" name="Submit Form 2 ONLY">
</form>
<input type="button" name="Submit Form 1 data including form 2">
</form>
내가 Form1의 전체를 제출해야을,하지만 난을 Form2를 제출할 때 난 단지 (Form2를의 데이터를 제출하는 모든 것을하지합니다 form1.)이게 효과가 있니?
설명하신 내용이 적용되지 않습니다.
한 가지 해결 방법은 중첩되지 않은 두 가지 양식을 만드는 것입니다. 원래의 중첩 된 양식의 입력을 복제하는 원래의 부모 양식에 대해 숨겨진 입력을 사용합니다. 그런 다음 Javascript/DOM 조작을 사용하여 제출 이벤트를 "상위"양식에 연결하고 양식을 제출하도록 허용하기 전에 "중첩 된"양식의 값을 "상위"양식의 숨겨진 입력으로 복사하십시오.
이 (무시 레이아웃 HTML)과 같이 보일 것이다 양식 구조 :
<form id="form1">
<input name="val1"/>
<input name="val2" type="hidden" />
<input type="button" name="Submit Form 1 data including form 2"
onsubmit="return copyFromForm2Function()">
</form>
<form id="form2">
<input name="val2"/>
<input type="button" name="Submit Form 2 ONLY">
</form>
당신은 중첩 된 수없는 형태 (source는) 그래서이 작동하지 않습니다.
모든 형태
는 FORM 요소에 묶어야합니다. 이 하나의 문서, 에 여러 형태가 될 수 있지만 FORM 요소는 유효하지의
중첩 될 수 없습니다 내 경험에 임의의 결과를 생성합니다.
당신은 몸으로 퍼팅을 제출을 Form1에서 Form2를 복용를 Form1에 다시 넣고, 자바 스크립트의 DOM 함수를 사용하여이 문제를 해결 할 수있다.
편집 : 아직도 형태의 중첩 된 것처럼이 오른쪽 중 하나를 100 %되지 않습니다. 몇 가지 답변이 지적했듯이 두 가지 형태가 필요합니다. DOM 마법을 사용하면서도이 작업을 수행 할 수 있습니다. 그러나 Randolpho의 답변을 더 자세히 살펴보십시오.
UI에 문제가있을 수 있습니다. 하나의 양식 (일부로 보이는 것)의 일부만 제출/저장되는 경우 사용자에게 매우 혼란 스러울 것입니다.
오히려 잘못된 언급 한 바와 같이, 중첩 형태,보다, 난 당신이 아마 일부 AJAX 데이터의 부분 집합을 업데이트하는 대신 호출 구현 볼 필요가 있다고 생각.
가능한 솔루션 대신 중첩 된 형태를 갖는의하는 JS 메소드를 호출 할 Form2를 버튼에 onClick 이벤트를 추가를 form1에서 특정 항목 (이 경우 val2 입력)을 가져올 수 있고 AJAX 또는 xmlHTTPRequests()를 사용하여 원하는 POST 메서드를 수행 할 수 있습니다.
다른 사람들이 말했듯이 양식 요소를 중첩 할 수 없습니다. 이런 식으로 처리하는 방법은 단일 폼을 사용하고 필드 세트로 요소를 그룹화하는 것입니다. 그런 다음 제출 단추에 javascript로 이벤트를 추가하고 제출해야하는 입력 필드를 사용 가능/사용 불가능하게 할 수 있습니다. jQuery를, Mootools의 또는 다른 프레임 워크와
이 매우 간단하다. 그러나 클라이언트가 스크립트를 비활성화하면 중단됩니다.
$('submit2').addEvent('click', function (e) {
e.stop();
$$('#fieldset1 input').set('disabled', 'disabled');
$('form').submit();
$$('#fieldset2 input').set('disabled', '');
}
아, 나는 나에게 여기
:-) 나쁜 유용성 같은 의심 소리 때문에,이 작업을 수행하는 좋은 이유가 신뢰 :
Mootools의 솔루션은 다음과 같을 수 있습니다 명확한 작동 대답입니다. 여분의 부모 DIV를 만들 필요가 없으며 id = "place_here"로 이름을 지정했습니다. 테이블 셀 id = "place_here"의 이름을 지정하고 DIV id = "div_2"의 부모로 만드는 것으로 충분했습니다. 이것은 약간의 멋진 작업입니다. 다른 스레드의 누군가가이 일을 도와주었습니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"><head>
<title>test/crtp</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
position_mdiv()();
$(window).resize(function() {
position_mdiv();
});
})
function position_mdiv(){
var pos = $('#place_here').position();
var width = $('#place_here').outerWidth();
$('#div_2').css({
position: "absolute",
top: pos.top +2 + "px",
left: (pos.left -300 + width) + "px"
});
}
</script>
<body>
<form id="CTRP_Form">
<table border="1">
<tr>
<td>
<div id="div_1"><input id="fnam" name="fnam" form="CTRP_Form" type="text"><input type=submit></div>
</td>
<td id="place_here" style="background:yellow;width:300px;padding:0px;border:solid 2px #CCC"></td>
</tr>
</table>
</form>
<div id="div_2"><form id="query_Form"><input id="MyQuery" name="MyQuery" form="query_Form" type="text"><input type=submit></form></div>
</body>
</html>
폼에 여러 개의 제출 버튼이 있습니다. 단추는 다른 CGI를 참조하고 CGI에서 조건부 처리를 처리하는 데 필요한 추가 필드를 가져 왔습니다. 이 필요한 이유는 무엇
코드
<form name="ep" method="put" action="/cgi-bin/edit_plan.pl">
[...]
<tr>
<td><input type="text" size="20" value="red" name="RN0"></td>
<td><input type="text" size="3" value="2" name="RT0"></td>
<td><input type="submit" value="Set row 0" name="RUN0"></td>
</tr>
[...] Add as many rows as needed, increment the 0 in all places Add an ending submit for overall processing instead of row processing: <input type="submit" value="Set ALL" name="SET">
</form>
OP와 공유 할 수있는 스 니펫이 있습니까? – Daniel
대상인 perl 스크립트 edit_plan.pl은 제출이 처리되는 방법을 제어하기 위해 제출 이름을 구문 분석합니다. –
니펫을? 두 개의 별개의 양식을 가지고 무엇이 잘못 되었습니까? –
시도하고있는 것에 대해 더 자세히 설명해 주시면 나 자신과 다른 사람들이 기꺼이 대체 솔루션을 제안 할 것이라고 확신합니다. –
중복 된 http://stackoverflow.com/q/555928/684229? – TMS