Question

我正在开发一个使用Symfony2进行时间管理的社交网络网站。作为该网站中组的管理员，您可以在组的日历中添加事件。页面如下： enter image description here

如果您点击日历上的任意位置，将显示一个包含表格的fancybox弹出窗口，您可以在下面的拍摄屏幕中看到： enter image description here

我想知道的是如何在提交其包含的表单后立即关闭fancybox弹出窗口。这是包含以下形式的页面代码（fancybox弹出窗口）：

    <html>
    <head>
        <title> Wkayet </title>
         <link rel="shortcut icon" href="{{asset('bundles/ikprojhome/images/icon-WKAYET.png')}}">
        <link rel="stylesheet" type="text/css" href="{{asset('bundles/ikprojhome/css2/css.css')}}"/>
        <script src='{{asset('bundles/ikprojhome/lib/jquery.min.js')}}'></script> 

    </head>
    <body>
        <script>
              function mout() {

                  $(document).jQuery.fancybox.close();
              </script>
    <center>
        <div id="container">
            <div id="header">

            </div>
            <div id="content">
                <table width="100%" height="100%" align="center">
                    <tr>
                        <td>
                            {% for x in groupe%}
   <form id="EventForm" action='{{path('ikproj_groupe_homepaeventsAdd',{id:x['id']})}}' method="POST" {{ form_enctype(form) }}>
                                {% endfor %}
                                 {{ form_errors(form) }}
                                <table align="center">
                                    <tr>
                                        <td class="separation"><label for="groupname">Titre</label></td>
                                        <td>
                                     <!--<input id="titre" name="titre" required="required" type="text" size="50"/> -->
                                         <div>
                                            {{ form_errors(form.title) }}

                                            {{ form_widget(form.title) }}
                                           </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="separation"><label for="debut">Début</label></td>
                                        <td><!--<select id="debut" name="debut" class="select"></select>-->
                                            <div>
                                             {{ form_errors(form.start ) }}

                                             {{ form_widget(form.start ) }}
                                            </div>


                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="separation"><label for="fin">Fin</label></td>
                                        <td><!--<select id="fin" name="fin" class="select"></select>-->
                                            <div>
                                             {{ form_errors(form.end ) }}

                                             {{ form_widget(form.end ) }}
                                          </div> 

                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="separation"><label for="lieu">Lieu</label></td>
                                        <td> <!--<select id="lieu" name="lieu" class="select"></select> -->

                                         <div>
                                           {{ form_errors(form.location) }}

                                         {{ form_widget(form.location , {'attr':{'class':'select '}}) }}
                                          </div>

                                        </td>
                                    </tr>
                                    <tr>
                                        <td id="description" valign="top" class="separation"><label for="description">Description</label></td>
                                        <td><textarea id="ikproj_groupebundle_eventsgroupe_description" name="ikproj_groupebundle_eventsgroupe[description]" rows="5" cols="40"></textarea> 



                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="2" align="center" id="button" valign="bottom"><input class="button" type="submit" value="" onclick="mout()"/></td>
                                    </tr>
                                </table>
                                         {{form_widget(form._token)}} 
                            </form>
                        </td>
                    </tr>
                </table> 
            </div>
        </div>
    </center>
</body>
</html>

正如你所注意到的那样，我把指令$(document).jQuery.fancybox.close(); ......放在这里的正确指示是什么？......有没有人有任何想法？

Answer 1

我猜你的功能应该是

<script>
function mout() {
    parent.jQuery.fancybox.close();
};
</script>

然后将其称为onsubmit，如

<form id="EventForm" onsubmit="mout()" action='{{path('ikproj_groupe_homepaeventsAdd',{id:x['id']})}}' method="POST" {{ form_enctype(form) }}>

请参阅 JSFIDDLE （在您的控制台中使用 persist ）

有关fancybox关闭方法的详细信息，请查看https://stackoverflow.com/a/9118087/1055987

如何在Symfony2中提交表单后立即关闭fancybox弹出窗口？

1 个答案: