Search code examples
javascripthtmlnicedit

nicEdit panel does not appear


I am using nicEdit as a notepad editor of my local site. I use a checkbox to call the nicEdit funcion (annotation), but the panel does not show up at all. Even the alert does not show up.

There are also three other functions to save the notes using cookie :

//annotation 
function annotation(player1) {
    bkLib.onDomLoaded(function(){
        new nicEditor({
            fullPanel : true,
            onSave : function(content, id, instance) {
                var player_name = document.getElementById('player1').value;
                alert(player_name);
                checkCookie(player_name);
                setCookie(content,player_name);
            }
        }).panelInstance('myArea');
    });
}

function setCookie(content,player) {
    var d = new Date();
    d.setTime(d.getTime() + (365*24*60*60*1000));
    var expires = "expires="+d.toUTCString();
    document.cookie = player + "=" + content + "; " + expires;
}

//check if the coockie with current player name exists
 function checkCookie(player_name) {
    var pnote = getCookie( player_name );
    //alert(pnote);
    if ( pnote!="" ) {
        $(".nicEdit-main").append(pnote);
    } else {
        if ( player_name != "" && player_name != null ) {
            $(".nicEdit-main").append("");
            alert("nothing");
        }
    }
}

//Gets the cookie content 
function getCookie(player_name) {
    var name = player_name + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
    }
    return "";
} 
<textarea style="height: 300px;" cols="52" id="myArea" name="myArea" style="width:450px; " ></textarea>
<input type="checkbox" onclick="annotation(player1)" id="player1" value="player1">player1 <br>


Solution

  • Well, to call

    bkLib.onDomLoaded(function(){}
    

    in your annotation function is wrong.

    Here is a way with jquery to handle the click event.

    $('#player1').click(function () {
    alert("player");
        new nicEditor({
            fullPanel : true,
            onSave : function(content, id, instance) {
                var player_name = document.getElementById('player1').value;
                alert(player_name);
                checkCookie(player_name);
                setCookie(content,player_name);
            }
        }).panelInstance('myArea');
    });
    

    A full example on jsfiddle https://jsfiddle.net/cqcu0hbp/