Отключить обновление страницы, после отправки формы

При отправке формы, на странице должен отрисовываться canvas. Но после того как форма отправлена, canvas отрисовывается на долю секунды и потом исчезает. Как сделать так, чтобы после отправки, canvas оставался на месте.

html code:

<form id="mainForm">
    <span id="header">Enter math expression:</span>
    <input type="text" id="inputExpr">
    <input type="submit" id="submitBtn" onclick="drawShelves()">
</form>
<canvas id="canvas"></canvas>
<script src="scr.js"></script>

js:

function drawShelves() {
    var canvas = document.getElementById('canvas'),
        ctx = canvas.getContext('2d');
    canvas.width  = 800;
    canvas.height = 400;
    ctx.lineWidth = 1.0;
    ctx.strokeStyle = 'black';
    ctx.beginPath();
    // left shelve
    ctx.strokeRect(5, 100, 340, 10);
    ctx.moveTo(5, 110);
    for (var i = 5; i < 340; i+=10) {
        ctx.lineTo(i+10, 100);
        ctx.moveTo(i+10, 110);
    }
    // right shelve
    ctx.strokeRect(455, 100, 340, 10);
    ctx.moveTo(455, 110);
    for (var i = 455; i < 790; i+=10) {
        ctx.lineTo(i+10, 100);
        ctx.moveTo(i+10, 110);
    }
    ctx.stroke();
}