通过显示莫代尔提交表单 [英] Submit a Form via a Reveal Modal

问题描述

我想提交表单，并打开与形式发布的数据就可以了模态。
模态工作正常，但表单提交不通过通过。

我已经试过的jQuery / AJAX，但没有运气。

 ＆LT;形式ID =frmTractors方法=邮报行动='process.php'＆GT;
    ＆LT;选择ID =拖拉机NAME =tractor_number＆GT;
       ＆LT;选项...＆GT;
    ＆LT; /选择＆GT;

    ＆LT;输入类型=提交值=提交数据显示-ID =myModal数据显示，AJAX =process.php/＆GT;
＆LT; /形式GT;

＆LT;！ -  ### MODAL ###  - ＆GT;
＆LT; D​​IV ID =myModal级=显示模态数据显示＆GT;＆LT; / DIV＆GT;
 

解决方案

我正在运行的网站上类似的事情：

HTML

 ＆LT;输入类型=隐藏ID =processURL值=process.php＆GT;
    ＆LT;选择ID =拖拉机NAME =tractor_number＆GT;
       ＆LT;选项...＆GT;
    ＆LT; /选择＆GT;
 

JUERY

  $（函数（）{
    $（#tractor）.change（函数（）{
        。VAR URL = $（'＃processURL）VAL（）;
        VAR tractor_number = $（本）.VAL（）;
        VAR postit = $。员额（URL，{tractor_number：tractor_number}）;
        postit.done（功能（数据）{

        $（'＃myModal）的基础（显示，开放）;

        }）;
    }）;
}）;
 

您不需要形式只是一个隐藏的输入来保存你的程序文件的URL

I am trying to submit a form and open a modal with the forms post data on it.
Modal works fine but the form post is not passed through.

I have tried jquery/ajax but no luck.

<form id="frmTractors" method="post" action='process.php'>
    <select id="tractor" name="tractor_number">
       <options...>
    </select>

    <input type="submit" value="Submit" data-reveal-id="myModal" data-reveal-ajax="process.php" />
</form>

<!-- ### MODAL ### -->
<div id="myModal" class="reveal-modal" data-reveal></div>

解决方案

I am running something similar on a site:

HTML

<input type="hidden" id="processURL" value="process.php">
    <select id="tractor" name="tractor_number">
       <options...>
    </select>

JUERY

$(function() {  
    $( "#tractor" ).change(function(){
        var url = $('#processURL').val();
        var tractor_number = $(this).val();                 
        var postit = $.post( url, {tractor_number:tractor_number});     
        postit.done(function( data ) {

        $('#myModal').foundation('reveal', 'open');

        });     
    }); 
}); 

You don't need a form just a hidden input to hold your process file url

这篇关于通过显示莫代尔提交表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！