2017-12-28 7 views
0

Ich möchte ein Formular in einem modalen Fenster anzeigen, aber ich habe meine Schaltflächen auf meinem Javascript, so dass ich möchte, dass sie die Schaltfläche "Senden" des Formulars.Zeige Formular in einem modalen Fenster mit Rails

Dies ist mein Code:

ich die modal mit dieser Javascript-Funktion zu öffnen, mit 2 Tasten:

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") 
    }); 
} 

Und das ist meine Form:

form_seite.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> 

Wie kann ich geltend, dass die Form durch diese Funktionstasten?

Antwort

0

Ich habe nicht ShopifyApp jemals verwendet, aber im Allgemeinen, wenn Sie ein Formular in Javascript senden möchten, können Sie submit() auf dem Element aufrufen. Sie möchten dem Formular eine ID geben, um es leicht zu finden.

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

Verwandte Themen