Question

我正在使用bootstrap popover在fullcalendar中呈现事件。当我正在徘徊事件时，它可以正常显示事件细节，但是当我尝试调整事件大小时，每次调整事件大小时弹出窗口都会创建，弹出窗口会卡住但永不淡出。这是截图

这是我的eventRender代码

 eventRender: function(event, element) {
                   $(element).popover({
                       title: 'Title: ' + event.title,
                       placement: 'right',
                       trigger: 'hover',
                       container: 'body',
                       html:true,
                       content: 'Start: ' + event.start.format("MMM DD YYYY HH:MM:SS") + '<br />End: ' + event.end.format("MMM DD YYYY HH:MM:SS") + '<br/>Description:' + event.description,
                   });
               },

如果我在popover中删除容器属性，它在任何条件下都能正常工作，但弹出窗口显示在月视图中由日历行限定。 bounded popover

Nb：我为我可怜的英语道歉

Answer 1

对我来说，@ Angainor的回答部分完成了这项工作。确实，当我们完成调整大小后，所有弹出窗口都消失了，但是在调整大小期间仍然有多个弹出窗口。这是我设法解决的方法

$('#calendar').fullCalendar({
eventResize: function(event, delta, revertFunc) { // Angainor's fix still needed
    $('.popover.fade.top').remove();
},
eventRender: function(eventObj, $el) { // Complementary to Angainor's fix
    $el.mousemove(function(e) {
        if (e.which === 1) {
            $('.popover.fade.top').remove();
        }
    }
},

...

Answer 2

这里的问题相同。我发布我的解决方案以帮助未来的开发人员：

我在＆＃34; eventResize＆＃34;中销毁了popover。功能。效果很好：

 <%@page contentType="text/html" pageEncoding="UTF-8"%>
    <%@page import="java.sql.PreparedStatement"%>
    <%@page import="java.sql.SQLException"%>
    <%@page import="java.sql.DriverManager"%>
    <%@page import="java.sql.ResultSet"%>
    <%@page import="java.sql.Statement"%>
    <%@page import="java.sql.Connection"%>
    <%@page import="java.sql.*"%>
    <%@page import="java.time.LocalTime"%>
    <%@page import="java.time.LocalDate"%>
    <%@page import="java.text.*,java.util.Date"%>
    <%@page import="java.time.Duration"%>
    <%@page import="java.time.Instant"%>
    <%@page import="java.util.Scanner"%>
    <%@page import="weblogic.connection.java.Weblogic_connection" %>
      <link type="text/css" rel="stylesheet" href="Stylesheet.css">


      <%

              Connection connection = null;
    Statement statement = null;
    ResultSet resultSet = null;
    ResultSet resultSet2 = null;



            %>

    <!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <title>Employee and vendor approve Page</title>

          <link type="text/css" rel="stylesheet" href="Stylesheet.css">

        </head>
        <br>
        <div class="title">
      <header>
                    <span class="name" style="color:blue;font-style:italic;">EMPLOYEE APPROVE PAGE</span>   
                </header>
                </div>
        <form method="post">
             &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

            <input type="submit" name="btnVIEW_LOGIN" value="VIEW_LOGIN" class="button button2">
            <%
            String btnVIEW_LOGIN=request.getParameter("btnVIEW_LOGIN");
            String Manager_id1=request.getParameter("manager_id");
            if(btnVIEW_LOGIN!=null)
            {
              response.sendRedirect("SearchSheet.jsp");
               session.setAttribute("manager_id", Manager_id1);
            }

            %>
        </form>

        <body background="images\blue_background.jpg">

        <label class="logoutLblPos">
        <a href="Logout.jsp" align="left">LOGOUT</a>
        </label>
                 <%
                  Class.forName("oracle.jdbc.driver.OracleDriver");
              Connection con=DriverManager.getConnection("jdbc:oracle:thin:@172.18.114.213:1821:godb","sbigi_gtrg","Spacess");

                 %>


            <table border="1" align="center" background="images\blue-wallpaper-7.jpg">
                <span class="name" style="color:white;font-style:bold;">  For Task  Approve </span>
                 <tr bgColor="yellow">
                     <td><font color="Red">PROJECT_NAME</font> </td>
                    <td><font color="Red">HEADER</font></td>
                    <td><font color="Red">DESCRIPTION</font></td>
                    <td><font color="Red">Employee_id</font></td>
                     <td><font color="Red">Approve</font></td>
                     <td><font color="Red">Status</font></td>
                </tr>
                <%
                   statement=con.createStatement();
                String Sql1="SELECT PK.PROJECT_ID,PK.PROJECT_NAME,PK.HEADER,PK.DESCRIPTION,DK.EMPLOYEE_ID,PK.approve FROM EMPLOYEE_TASK PK inner join REGISTRATION_EMPLOYEE dk on dk.employee_id=pk.employee_id where dk.REPORTING_MANAGER_ID='"+Manager_id+"' and PK.approve='Pending'";
                resultSet2=statement.executeQuery(Sql1);
                while(resultSet2.next())     
    {
        String PROJECT_ID=resultSet2.getString("PROJECT_ID");

          %>

         <tr>


                  <td><font size="4"> <font color="white"><%=resultSet2.getString("PROJECT_NAME")%></font></font></td>
                  <td><font size="4"> <font color="white"><%=resultSet2.getString("HEADER")%></font></font></td>
                  <td><font size="4"> <font color="white"><%=resultSet2.getString("DESCRIPTION")%></font></font></td>
                  <td><font size="4"> <font color="white"><%=resultSet2.getString("EMPLOYEE_ID")%></font></font></td>
                  <td><font size="4"> <font color="white"><%=resultSet2.getString("APPROVE")%></font></font></td>
                  <td>
                      <a href="TaskListApprove.jsp?id=<%=resultSet2.getString("EMPLOYEE_ID")%>&PROJECT_ID_update=<%=PROJECT_ID%>"><B>UPDATE</b></a>

                </td>

          </tr>


    <%

        }
    }
    catch(Exception ex)
    {
                out.println("<html><body><script type=\"text/javascript\">"); 
               out.println("confirm('Session Expired Login again');");
     out.println("location='EmployeeLogin.html';");
               out.println("</script></body></html>"); 

    }


                %>
            </table>
                  </form>
              <div class="footer">
      <p>KBC &nbsp;&nbsp;</p>
    </div>
        </body>

    </html>

Bootstrap popover卡在fullcalendar中

2 个答案: