웹개발을 하다보면, 팝업을 띄워서 보여주는 경우가 많다.&nbsp; 그런데, 팝업을 띄우지만 해당 파라미터를 보여주고 싶지 않을 때가 있다.&nbsp;(또는 마음대로 접근하지 못하도록 하고 싶을 때도...)&nbsp; 그 때 사용할 수 있는 소스다.uTdata 함수를 실행시키면, 팝업이 뜨면서 submit 동작을 한다. 아래와 같이 사용할 수 있으며, 팝업에는 항상 target을 지정해 주어야 한다. <div class="txc-textbox" style="border-style: solid; border-width: 1px; border-color: rgb(254, 254, 184); background-color: rgb(254, 254, 184); padding: 10px;">&nbsp;

function post_to_url(path, params, target, method) {

&nbsp;&nbsp;&nbsp; method
= method || "post";

&nbsp;&nbsp;&nbsp; target
= target || null;

&nbsp;

&nbsp;&nbsp;&nbsp; var
form = document.createElement("form");

&nbsp;&nbsp;&nbsp;
form.setAttribute("method", method);

&nbsp;&nbsp;&nbsp;
form.setAttribute("action", path);

&nbsp;&nbsp;&nbsp; if
(target != null)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
form.setAttribute("target", target);

&nbsp;

&nbsp;&nbsp;&nbsp; for (var
key in params) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var
hiddenField = document.createElement("input");

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
hiddenField.setAttribute("type", "hidden");

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
hiddenField.setAttribute("name", key);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
hiddenField.setAttribute("value", params[key]);

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
form.appendChild(hiddenField);

&nbsp; &nbsp;&nbsp;}

&nbsp;&nbsp;&nbsp;
document.body.appendChild(form);

&nbsp;

&nbsp;&nbsp;&nbsp;
form.submit();

&nbsp;&nbsp;&nbsp; return
false;

}

&nbsp;

function uTdata(id, opt) {

&nbsp;&nbsp;&nbsp; var
_opt = opt || "u";

&nbsp;&nbsp;&nbsp; var
_id = id || null;

&nbsp;&nbsp;&nbsp; if
(_id == null)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return;

&nbsp;

&nbsp;&nbsp;&nbsp; var
url = StringFormat("{{url_for('form.update')}}");

&nbsp;

&nbsp;&nbsp;&nbsp;
window.open("", "tnpdataUpdate", "menubar=0,
toolbar=0, scrollbars=1, status=1, width=830, height=800, resizable=0");

&nbsp;&nbsp;&nbsp;
post_to_url(url, { "id": _id, "opt": _opt }, "tnpdataUpdate", "post");

&nbsp;

}

&nbsp;</div> 추가적으로 ajax 호출 할 때 csrf 토큰을 항상 보내줘야하는데, 매 번 가져오기 귀찮을 때 하는 방법 <div class="txc-textbox" style="border-style: solid; border-width: 1px; border-color: rgb(254, 254, 184); background-color: rgb(254, 254, 184); padding: 10px;">&lt;meta name="csrf-token" content="{{ csrf_token() }}"&gt;&nbsp;&lt;script type="text/javascript"&gt;&nbsp;&nbsp;&nbsp; var
csrftoken = $('meta[name=csrf-token]').attr('content')&nbsp;&nbsp;&nbsp;
$.ajaxSetup({&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
beforeSend: function (xhr, settings) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type)
&amp;&amp; !this.crossDomain) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
xhr.setRequestHeader("X-CSRFToken", csrftoken)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp; });





















&lt;/script&gt;</div> 위와 같이 셋팅해주면, 비동기&nbsp;호출 전 헤더에 csrf토큰을 항상 넣어줄 수 있어 편하다.

팝업창 띄우고 포스트로 이동 시키기 Jquery Post Popup