그것은 가능한 전화를 자바 스크립트의 onsubmit 이벤트에서 프로그래밍 방식으로 형태가 있습니까?
-
09-06-2019 - |
문제
에 Ruby on Rails,나를 업데이트하려면 innerHTML
의 div 태그를 사용하는 form_remote_tag
helper.이 업데이트될 때마다 발생 관련 태그 선택을 받는 onchange 이벤트입니다.문제입니다, <select onchange="this.form.submit();">
;이 작동하지 않습니다.도 document.forms[0].submit()
.을 얻을 수있는 유일한 방법 onsubmit 에서 생성된 코드 form_remote_tag 실행를 만들어 숨겨진 제출 버튼 호출을 클릭에 대한 메서드에서 버튼을 선택 태그입니다.여기에는 작업 ERb 부분적인 예이다.
<% form_remote_tag :url => product_path, :update => 'content', :method => 'get' do -%>
<% content_tag :div, :id => 'content' do -%>
<%= select_tag :update, options_for_select([["foo", 1], ["bar", 2]]), :onchange => "this.form.commit.click" %>
<%= submit_tag 'submit_button', :style => "display: none" %>
<% end %>
<% end %>
무엇을 원하는 무언가가 다음과 같이지만,그것은 작동하지 않습니다.
<% form_remote_tag :url => product_path, :update => 'content', :method => 'get' do -%>
<% content_tag :div, :id => 'content' do -%>
# the following line does not work
<%= select_tag :update, options_for_select([["foo", 1], ["bar", 2]]), :onchange => "this.form.onsubmit()" %>
<% end %>
<% end %>
그래서,어떤 방법을 제거하는 보이지 않는 제출 버튼이 활용 사례를 보유하고 계십니까?
있을 것으로 보인다.그래서,그것을 설명해 보고자 한다.기본적인 문제는 submit()
지 않는 전화 onsubmit()
code 으로 렌더링됩니다.
실제 HTML 형태로는 레일을 렌더링에서 이 ERb 다음과 같습니다:
<form action="/products/1" method="post" onsubmit="new Ajax.Updater('content', '/products/1', {asynchronous:true, evalScripts:true, method:'get', parameters:Form.serialize(this)}); return false;">
<div style="margin:0;padding:0">
<input name="authenticity_token" type="hidden" value="4eacf78eb87e9262a0b631a8a6e417e9a5957cab" />
</div>
<div id="content">
<select id="update" name="update" onchange="this.form.commit.click">
<option value="1">foo</option>
<option value="2">bar</option>
</select>
<input name="commit" style="display: none" type="submit" value="submit_button" />
</div>
</form>
고 싶은 도끼로 보이지 않는 제출 버튼 사용 직선 형태입니다.제출 나타나 작동하지 않습니다.그래서 나는 몇 가지 방법이 필요를 호출하는 양식의 onsubmit 이벤트 코드입니다.
업데이트:Orion 에드워드 솔루션을 작동하는 경우에 없었다 return(false);
에 의해 생성되기도 합니다.나는 확실하지 않는 더 나빠지를 보내는 팬텀을 클릭하여 눈에 보이지 않는 제출 버튼 또는 전화 eval 에 getAttribute('onsubmit')
출을 제거한 후 반환 통화와 자바스크립트 문자열이다.
해결책
지 않은 경우 실제로 원하는 양식을 제출하는지만,호출한 모든 코드에 일어난 onsubmit,당신을 가능하게 할 수 있었다:(스트)
var code = document.getElementById('formId').getAttribute('onsubmit');
eval(code);
다른 팁
나는 깨닫게 이 질문은 종류의 오래된하지만,당신은 도대체 무슨 일을 eval 니까?
document.getElementById('formId').onsubmit();
document.getElementById('formId').submit();
나
document.formName.onsubmit();
document.formName.submit();
때 DOM 문서의 로드,이벤트는 문자열이 아니라,더 이상 그들이는 기능입니다.
alert(typeof document.formName.onsubmit); // function
그래서 아무 이유도 없을 변환하는 기능을 문자열 수 있습니다 그래서 그냥 eval 니다.
주의 양식 id
.
다음
document.getElementById('formid').submit();
을 로드하는 경우에는 Javascript 로 div
via innerHTML
,그것은 실행되지 않습니다...그냥 참고하시기 바랍니다.
를 사용해야 하는 경우에는 철도의 건축에서 Javascript 세대 내가 사용하는 것이 오리온의 솔루션이지만,하나의 작은 변화 보상에 대한 반환 코드입니다.
eval ('(function(){' + code + '})()');
그러나 제 생각에 당신은 쉽게 시간에 의해 밖으로 분리하는 Javascript 코드로 외부 파일이나 별도의 함수 호출 가능.
하지 않습니다.
당신은 해결책을 가지고 있습니다.
을 중지,다음에 이동 기능을 지점입니다.
내가 알고,그것은 꽤 있지만,더 큰 문제입니다.
확실하지 않은 경우 응답이 있거나지 않지만, onclick
함수의 선택,전화 onsubmit
대 submit
.
이론적으로,같은 뭔가 eval ('function(){' + code + '}()');
할 수 있 작업(는 구문을 실패하지만).는 경우에도하는 작업을했다,그것은 여전히 정의 빈민가를 부르는 평가를 통해 선택 onchange
.다른 솔루션을 것을 어떻게든 레일 주사 onsubmit
코드 onchange
분야 선택 태그,하지만 나는 확실하지 않는 경우 방법이 있습니다.ActionView 는 link_to_remote 지만,없는 명백한 도우미 동일한 코드를 생성에서 onchange
다.