JQuery SimpleModal

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对话框一样，简单模式将按钮从< form >元素中去掉，而不是通常将所有内容包装在ASP.NET和JSF等框架中，并将它们放在< /body >结束标记前面。所以你必须使用persist: true选项调用modal，并在单击"submit按钮“时关闭modal并触发表单提交。您必须关闭模式，以便元素返回到它们在DOM中的正常位置...:)

Answer 3

这是我得到的代码。没什么花哨的。隐藏的表单在form标签中，我使用的是提交按钮。

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