동적으로 양식 생성 및 제출
jQuery에 즉시 양식을 만들고 제출하는 방법이 있습니까?
아래와 같은 것.
<html>
<head>
<title> Title Text Goes Here </title>
<script src="http://code.jquery.com/jquery-1.7.js"></script>
<script>
$(document).ready(function(){alert('hi')});
$('<form/>').attr('action','form2.html').submit();
</script>
</head>
<body>
Content Area
</body>
</html>
작동해야하나요 아니면 다른 방법이 있나요?
코드에 두 가지 문제가 있습니다. 첫 번째 $(document).ready();는 요소를 생성하는 jQuery 개체를 포함 했지만 래핑하지 않은 것입니다.
두 번째는 사용하던 방법입니다. jQuery는 선택기 (또는 일반적으로 선택기를 배치 할 위치)가 생성하려는 요소로 대체 될 때 모든 요소를 생성합니다. 그런 다음 본문에 추가하고 제출하면됩니다.
$(document).ready(function(){
$('<form action="form2.html"></form>').appendTo('body').submit();
});
작동중인 코드는 다음과 같습니다 . 이 예에서는 양식 요소를 추가한다는 것을 증명하기 위해 자동 제출이 아닙니다.
다음 은 자동 제출 코드입니다. 잘 작동합니다. Jsfiddle은 "form2.html"이 서버에 존재하지 않기 때문에 404 페이지로 이동합니다.
예, 가능합니다. 솔루션 중 하나는 다음과 같습니다 ( jsfiddle as a proof ).
HTML :
<a id="fire" href="#" title="submit form">Submit form</a>
(위에는 양식이 없습니다 참조)
자바 스크립트 :
jQuery('#fire').click(function(event){
event.preventDefault();
var newForm = jQuery('<form>', {
'action': 'http://www.google.com/search',
'target': '_top'
}).append(jQuery('<input>', {
'name': 'q',
'value': 'stack overflow',
'type': 'hidden'
}));
newForm.submit();
});
위의 예는 양식을 작성하는 방법, 입력을 추가하는 방법 및 제출하는 방법을 보여줍니다. 때때로 결과 표시가에서 금지되어 X-Frame-Options있으므로 기본 창의 내용을 대체하는로 설정 target했습니다 _top. 또는을 설정하면 _blank새 창 / 탭에 표시 될 수 있습니다.
jQuery가없는 My 버전, 간단한 기능을 즉시 사용할 수 있습니다.
함수:
function post_to_url(path, params, method) {
method = method || "post";
var form = document.createElement("form");
form.setAttribute("method", method);
form.setAttribute("action", path);
for(var key in params) {
if(params.hasOwnProperty(key)) {
var hiddenField = document.createElement("input");
hiddenField.setAttribute("type", "hidden");
hiddenField.setAttribute("name", key);
hiddenField.setAttribute("value", params[key]);
form.appendChild(hiddenField);
}
}
document.body.appendChild(form);
form.submit();
}
용법:
post_to_url('fullurlpath', {
field1:'value1',
field2:'value2'
}, 'post');
Purmou와 비슷하지만 제출이 완료되면 양식을 제거합니다.
$(function() {
$('<form action="form2.html"></form>').appendTo('body').submit().remove();
});
예, 따옴표를 잊어 버렸습니다 ...
$('<form/>').attr('action','form2.html').submit();
Josepmra example works well for what i need. But i had to add the line
form.appendTo( document.body )
for it to work.
var form = $(document.createElement('form'));
$(form).attr("action", "reserves.php");
$(form).attr("method", "POST");
var input = $("<input>")
.attr("type", "hidden")
.attr("name", "mydata")
.val("bla" );
$(form).append($(input));
form.appendTo( document.body )
$(form).submit();
Try with this code It is totaly dinamic solution
var form = $(document.createElement('form'));
$(form).attr("action", "reserves.php");
$(form).attr("method", "POST");
var input = $("<input>").attr("type", "hidden").attr("name", "mydata").val("bla");
$(form).append($(input));
$(form).submit();
Why don't you $.post or $.get directly?
GET requests:
$.get(url, data, callback);
POST requests:
$.post(url, data, callback);
Then you don't need a form, just send the data in your data object.
$.post("form2.html", {myField: "some value"}, function(){
alert("done!");
});
참고URL : https://stackoverflow.com/questions/8003089/dynamically-create-and-submit-form
'IT TIP' 카테고리의 다른 글
| 0/1 대신 부울 유형에 대해 Y / N을 저장하도록 최대 절전 모드 (JPA 사용)를 구성합니다. (0) | 2020.10.17 |
|---|---|
| ImportError : BeautifulSoup이라는 모듈이 없습니다. (0) | 2020.10.17 |
| 조각에서 활동 시작 (0) | 2020.10.17 |
| 32 비트 정수가 오버플로되면 64 비트 길이 대신 40 비트 구조를 사용할 수 있습니까? (0) | 2020.10.17 |
| Swift 3 GCD API 변경 후 dispatch_once (0) | 2020.10.17 |