Click here to Skip to main content
15,892,298 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi guys,

I'm using FullCalendar Jquery.

When user select date, it shows light green color in calendar.

But when deselect/remove date, it is show getting deselected, instead its shows as
selected.

HTML CODE:
<div id='calendar'></div>


What I have tried:

JQUERY CODE: 

 var dates = new Array();

    function addDate(date) {
        if (jQuery.inArray(date, dates) < 0) dates.push(date);
    }

    function removeDate(index) {
        dates.splice(index, 1);
    }

    function printArray() {
        var printArr="";
        dates.forEach(function (val) {
            printArr += val + ',';
            
        });
        printArr =  printArr.slice(0, -1) ;
        var myArr = printArr.split(",");
        alert(myArr.sort());
    }
    // Adds a date if we don't have it yet, else remove it
    function addOrRemoveDate(date) {
        
        var index = jQuery.inArray(date, dates);
        if (index >= 0)
            removeDate(index);
        else
            addDate(date);

        printArray();
    }

    // Takes a 1-digit number and inserts a zero before it
    function padNumber(number) {
        var ret = new String(number);
        if (ret.length == 1) ret = "0" + ret;
        return ret;
    }
$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultView: 'month',
    events: [{
        start: '2014-11-12T13:00:00',
        end: '2014-11-12T16:00:00',
    }, ],
    selectable: true,
    select: function (start, end, jsEvent, view) {
            addOrRemoveDate(start.format());
        $("#calendar").fullCalendar('addEventSource', [{
            start: start,
            end: end,
            rendering: 'background',
            block: false,
        }, ]);
    },
    selectOverlap: function(event) {
        return ! event.block;
    }
});



plz ref the fiddle:

I want to remove the color when its deselected.

Please guys help me.


Thanks
Posted
Updated 25-Sep-16 23:11pm
v2

1 solution

Its in jquery calendar CSS file, in which you need to modify the color to none.
You can follow the steps:
1. Select your control from some debugger (Like Firebug or crome's default debugger)
2. Set the color property to none for that particular control's name or class or Id .
3. Also you can write your own css class and attach that class with your control.
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900