[소스] javascript, jquery form 만들기
2018.12.03
작성일/수정일
2023-03-09 09:52:50 / 2018-12-03 16:55:45
Form는 document 내 엘리먼트이기 때문에 필요한 경우 생성해서 사용 할수 있다.
Javascript function으로 구부하는 형태
** FROM 만들기 함수
function makeForm( actionURL ) {
var f = document.createElement("form");
f.name = "frmHandle";
f.action = actionURL;
f.method = "post";
f.target = "";
return f;
}
** FORM element만들기 함수
function addData(name, value) {
var elem = document.createElement("input");
elem.setAttribute("type", "hidden");
elem.setAttribute("name", name);
elem.setAttribute("value", value);
return elem;
}
** FORM을 만들고 element추가 후 form submit
window.onload = function()
{
var frm = makeForm("/login");
frm.appendChid(addData("name","nextman"));
frm.submit();
}
Javascript
출처 : https://ifuwanna.tistory.com/196
/* Javascript */
//create element (form)
var newForm = document.createElement('form');
//set attribute (form)
newForm.name = 'newForm';
newForm.method = 'post';
newForm.action = 'https://ifuwanna.tistory.com/196';
newForm.target = '_blank';
//create element (input)
var input1 = document.createElement('input');
var input2 = document.createElement('input');
//set attribute (input)
input1.setAttribute("type", "hidden");
input1.setAttribute("name", "data1");
input1.setAttribute("value", "value1");
input2.setAttribute("type", "hidden");
input2.setAttribute("name", "data2");
input2.setAttribute("value", "value2");
//append input (to form)
newForm.appendChild(input1);
newForm.appendChild(input2);
//append form (to body)
document.body.appendChild(newForm);
//submit form
newForm.submit();
Jquery
/* Jquery */
//create element(form)
var newFrom = $('<form></form>');
//set attribute(form)
newForm.attr("name", "newFRom");
newForm.attr("method", "post");
newForm.attr("action", "http://relation.co.kr");
newForm.attr("target", "_blank");
//create elemant & set attribute (input)
newForm.append($('<input/>', {type:'hidden', name:'data1', value:'value1'}));
newFrom.append($('<input>'), {type:'hidden', name:'data2', value:'value2'}));
//append form (to body)
newFrom.append('body');
//submit from
newFrom.submit();