2017-10-21 71 views
0

J'utilise FullCalendar 3.5.1liens d'ancrage ne fonctionne pas en vue de la semaine et jour dans FullCalendar

Mes événements sont rendus par eventRender en injectant des liens sur les données d'événement. Ces liens fonctionnent sur la vue mensuelle. Mais lorsque je passe en mode Semaine ou Jour, ces liens ne sont pas cliquables. J'ai mis un jsfiddle ici https://jsfiddle.net/y8d0v6o3/1/ Sur le violon dans la vue mensuelle, lancez une erreur de console mais c'est parce que toutes les fonctions ne sont pas là sur le violon mais cela implique aussi que les liens sont cliqués. Sur la vue Jour/Semaine, il n'y a même pas d'erreur.

eventRender: function(event, element, view) { 
       element.find(".fc-title").remove(); 
       //element.find(".fc-time").remove(); 
       $(element).css("margin-top", "3px"); 
       $(element).addClass('event-on-' + event.start.format('YYYY-MM-DD')); 
       var wsTitleStyle = 'class="titlelinkConfirm"'; 
       if(event.autoscheduled){ 
        wsTitleStyle = 'class="titlelinkAutoSchd"'; 
       } 
       if(event.missed){ 
        //if missed change title color 
        wsTitleStyle = 'class="titlelinkMissed"'; 
       } 
       var pbSurveyFlag = event.isSurvey ? 2 : 1; 
       if(event.title == 'ZZZZXXXYYY'){ 
        event.eventBorderColor = '#FFF'; 
        var wsMomentDate = event.start.format('YYYY-MM-DD'); 
        var new_description ='<br/><a class="alink" href="javascript:calDetails('+ '&#39;'+'audits-appt-day.cfm' + '&#39;'+',500,400,' + '&#39;'+event.encryptedStart +'&#39;' +',' + '&#39;'+ 'dayView' + '&#39;' + ','+'0' +')">' 
       + 'Details' + '</a>' + '&nbsp;&nbsp;&nbsp;&nbsp;' 
       + '<a class="alink" href="javascript:calDetails('+ '&#39;'+'audits-mapDay.cfm' + '&#39;'+',800,600,' + '&#39;'+event.encryptedStart +'&#39;' +',' + '&#39;'+ 'dayView' + '&#39;' +',' + '&#39;' + wsMomentDate +'&#39;' +')">' 
       + '<strong>Map Day</strong>' + '</a>' 
       ; 

       element.append(new_description); 
       //do not allow this to be dragged 
       event.editable = false; 
       }else{ 

       if (event.autoscheduled && !event.missed){ 
        slink = '<a class="alink" href="javascript:doConfirmCal(' + '&#39;'+ event.auditID+'&#39;'+','+event.eventID+')">Confirm</a>'; 
       } else if(!event.missed){ 
        slink = '<a class="alink" href="javascript:popupReDirectEncryptedURL('+ '&#39;'+ 'auditID=' + event.auditID +'&missed='+ event.eventID +'&type=' + pbSurveyFlag+ '&#39;'+',' + '&#39;'+ 'ticket-progress.cfm' +'&#39;' + ',' + '800,500,'+ '&#39;'+'apptLetter' + '&#39;'+')">Missed</a>'; 
       } 
       var new_description = '<a ' +wsTitleStyle+ ' href="javascript:LoadApptPage(' + event.eventID +',' + pbSurveyFlag +')">' 
        + event.title + '</a><br/><br/>' 
        + '<a class="alink" href="javascript:LoadFlexPage(' + '&#39;' + event.auditID + '&#39;' +',' + '&#39;'+pbSurveyFlag +'&#39;' +')">' 
        + 'View' + '</a>' + '&nbsp;&nbsp;' 
        + slink 
        + '<br/>' + '&nbsp;&nbsp;&nbsp;&nbsp;' + '<a class="alink" href="admin-timeTracking.cfm?isSurvey=' +pbSurveyFlag+'&auditID=' + event.auditID +'&date='+event.encryptedStart +'">' 
        + 'Submit Time' + '</a>' 
        ; 

       element.append(new_description); 
       } 
      } 

Répondre

0

J'ai trouvé que c'était le numéro de z-index. Fullcalendar.css ajoute z-index à ses éléments css. J'ai donc ajouté position: relative;

et un z-index assez élevé sur mon tag d'ancrage css et qui a résolu le problème.