Question

我的模态中有一个提交按钮，当它被按下时没有任何反应！按下提交按钮后，如何提交表单？我不想使用$（'form'）。submit（）;因为然后php没有检测到我的按钮被点击了。

<script type="text/javascript" language="javascript">
    $(document).ready(function () { 
        $('#btnAdd').click(function (e) { 
            //clicking the button shows the modal popup up 
            e.preventDefault();
            $('#AddCareerItem').modal(); 
        });
        $('#btnCancelCareerContent').click(function (e) {
            //close the modal with the cancel button 
            $.modal.close();
        }); 
    }); 
</script>

Answer 1

马特，

根据您提供的代码，您似乎没有绑定到提交事件。 #AddCareerItem里面的HTML是什么样的？您使用提交输入并具有正确的表单定义吗？

如果想要绑定事件，则需要使用onShow回调。类似的东西：

$('#AddCareerItem').modal({onShow: function (dialog) {
    $("form", dialog.data).submit(function () {
        // your code here
    });
});

希望有所帮助。

-Eric

http://www.ericmmartin.com

Answer 2

正如jquery UI对话框所做的那样，simple-modal将按钮从＆lt;形式＆gt;元素通常包含ASP.NET和JSF等框架中的所有内容，并将它们预先添加到＆lt; / body＆gt;结束标签。因此，您必须使用选项persist调用模态：true并单击“提交按钮”关闭模式并触发表单提交。你必须关闭模态，以便元素返回到DOM中的正常位置......：）

Answer 3

这是我所拥有的代码。没有什么花哨。隐藏的表单位于表单标记内，我正在使用提交按钮。

    <form action="somepage.php" enctype="multipart/form-data" method="post">
        <div class="rw">
            <div class="lb">Title</div>
            <div class="dt"><input type="text" name="txtTitle" value="" /></div>
            <div class="cr"></div>
        </div>
        <div class="rw">
            <div class="lb">Description</div>
            <div class="dt"><textarea name="txtDescription" ></textarea></div>
            <div class="cr"></div>
        </div>
        <div class="rw">
            <div class="lb">&nbsp;</div>
            <div class="dt"><button id="btnAdd" type="button" >Add Career Item</button></div>
            <div class="cr"></div>
        </div>
        <div class="rw">
            <div class="lb">&nbsp;</div>
            <div class="dt"><input type="submit" name="btnSave" value="Save" /></div>
            <div class="cr"></div>
        </div>
        <div id="AddCareerItem" style="display:none;">
                <div class="rw">
                    <div class="lb">Type</div>
                    <div class="dt"><select name="drpdwnType" ><option value="1">Duties</option><option value="2">Required</option></select></div>
                    <div class="cr"></div>
                </div>
                <div class="rw">
                    <div class="lb">Content</div>
                    <div class="dt">
                        <input name="txtCareerDetailContent" type="text" value="" />
                    </div>
                    <div class="cr"></div>
                </div>
                <div class="rw">
                    <div class="lb">&nbsp;</div>
                    <div class="dt"><input type="submit" id="btnAddCareerDetail" name="btnAddCareerDetail" value="Add" /> <input type="button" id="btnCancelCareerContent" value="Cancel" /></div>
                    <div class="cr"></div>
                </div>
        </div>
    </form>

JQuery SimpleModal

3 个答案: