2017-12-28 27 views
0

모달 창에 양식을 표시하고 싶지만 자바 스크립트에 내 단추가 있으므로 양식의 "제출 단추"를 만들고 싶습니다. 2 개 버튼 내가이 자바 스크립트 기능을 모달을 열레일이있는 모달 창에 양식 표시

, :

내 코드입니다

modal.js

window.newModal = function(path, title){ 
    ShopifyApp.Modal.open({ 
    src: path, 
    title: title, 
    height: 400, 
    width: 'large', 
    buttons: { 
     primary: { 
     label: "OK", 
     message: 'modal_ok', 
     callback: function(message){ 
      ShopifyApp.Modal.close("ok"); 
     } 
     }, 
     secondary: { 
     label: "Cancel", 
     callback: function(message){ 
      ShopifyApp.Modal.close("cancel"); 
     } 
     } 
    }, 
    }, function(result){ 
    if (result == "ok") 
     ShopifyApp.flashNotice("'Ok' button pressed") 
    else if (result == "cancel") 
     ShopifyApp.flashNotice("'Cancel' button pressed") 
    }); 
} 

그리고 이것은 내 양식입니다 :

form_page.html.erb

<section> 
<section class="full-width" align="center"> 
    <article> 
    <div class="card" style="margin-bottom:0px;"> 
     <form method="POST" action="form_page"> 
     <input name="authenticity_token" value="<%= form_authenticity_token %>" type="hidden"> 
     <div class="row"> 
      <label>Dirección:</label> 
      <input type="text" name="address"/> 
     </div> 
     <div class="row"> 
      <label>Apt, suite, etc. (opcional):</label> 
      <input type="text" name="addressopt"/> 
     </div> 
     <div class="row"> 
      <label>Código Postal:</label> 
      <input type="text" name="postal" pattern="[0-9]{5}"/> 
     </div> 
     <div class="row"> 
      <label>Phone (opcional):</label> 
      <input type="text" pattern="[0-9]{9}" name="phone"/> 
     </div> 

     <div class="row"> 
     <label>City:</label> 
      <select name="city"> 
       <option>Madrid</option> 
       <option>Barcelona</option> 
       <option>Málaga</option> 
      </select> 
     </div> 
    </form> 
    </div> 
    </article> 

어떻게 그 기능 버튼을 통해 그 양식을 제출할 수 있습니까?

답변

0

저는 ShopifyApp를 사용해 본 적이 없지만, 일반적으로 자바 스크립트에서 양식을 제출하려면 submit()을 해당 요소에 호출하면됩니다. 양식을 쉽게 찾을 수있는 ID를 제공하고 싶을 것입니다.

https://www.w3schools.com/jsref/met_form_submit.asp