मैं पूर्ण रंगों में, अलग-अलग रंगों के साथ ईवेंट पृष्ठभूमि रंग कैसे बदलूं?

Question

मैं पूर्णकेंडर के अंतिम संस्करण का उपयोग कर रहा हूं, मैंने प्रलेखन को देखा कि पृष्ठभूमि रंग घटना कैसे बदलती है, लेकिन मुझे नहीं पता कि अलग-अलग घटनाओं को कैसे बनाया जाए।
मुझे चित्र की तरह लाल, नीले, हरे रंग की घटनाओं के साथ कोड नमूना की आवश्यकता है।

मैं इस कोड को देखते हैं, दस्तावेज़ साइट पर है, लेकिन मैं 2 रंग लागू करने के लिए नहीं कर सकते हैं:

$('#calendar').fullCalendar({ 
     editable: true,    events: [ 
      { 
       title: 'Teste1', 
       start: new Date(y, m, d, 10, 30), 
       allDay: false, 
       editable: false 
      }, 
      { 
       title: 'Teste2', 
       start: new Date(y, m, d, 11, 40), 
       allDay: false 
      }   ], eventColor: '#378006'  }); 

Answer 1

आप नवीनतम संस्करण (1.5) का उपयोग कर रहे हैं, आप backgroundColor गुण सेट कर सकते हैं।

{ 
    title: 'Teste1', 
    start: new Date(y, m, d, 10, 30), 
    allDay: false, 
    editable: false, 
    backgroundColor: '#SomeColor' 
}, 
{ 
    title: 'Teste2', 
    start: new Date(y, m, d, 11, 40), 
    allDay: false, 
    backgroundColor: '#SomeOtherColor' 
} 

अगर आपको लगता है कि बदलने के लिए और साथ ही जरूरत है तुम भी textColor गुण सेट कर सकते हैं।

Answer 2

उपयोग सीएसएस और className संपत्ति।

<style> 
.event { 
    //shared event css 
} 

.greenEvent { 
    background-color:#00FF00; 
} 

.redEvent { 
    background-color:#FF0000; 
} 
</style> 

<script> 
$('#calendar').fullCalendar({ 
     editable: true,    events: [ 
      { 
       title: 'Teste1', 
       start: new Date(y, m, d, 10, 30), 
       allDay: false, 
       editable: false, 
       className: ["event", "greenEvent"] 
      }, 
      { 
       title: 'Teste2', 
       start: new Date(y, m, d, 11, 40), 
       allDay: false, 
       className: ["event", "redEvent"] 
      }   ], eventColor: '#378006'  }); 
</script> 

Answer 3

मैंने प्रत्येक घटना के लिए इस तरह का रंग कोड लागू किया है, यह मेरे लिए काम करता है।

$.each(data, function(i, v){  
    var event =[];  
    var col = "";   
          if(v.Status == 1)  
          { 
           col = "#00c0ef"; 
          } 
          else if(v.Status == 2){ 
           col = "#dd4b39"; 
          }  
          else if (v.Status === 3) 
          {  
           col = "#f39c12"; 
          }  
          else { 
           col = "#00a65a"; 
          }  
         event.push({ 
          title: v.AssignedName + "\n Installation Date: \n" + da,  
          start: da,  
          backgroundColor: col,  
           textColor:'black'  
         }) 
});