I'm not sure I understand why adding tileX and tileY is a bad thing? If you want to draw the whole tileset, one way of doing it is with a couple of for loops like so.

var tileSize = 32;
var x = 10;
var y = 10;

for(var tileX = 0; tileX < x; tileX ++) {
    for(var tileY = 0; tileY < y; tileY++) {
        context.drawImage(image, tileX * tileSize,tileY * tileSize , tileSize, tileSize);
    }
}

Just my preference, but the naming below might make things a bit more clear as well.

var tileSize = 32;
var width = 10;
var height = 10;

for(var x = 0; x < width ; x++) {
    for(var y = 0; y < height; y++) {
        context.drawImage(image, x * tileSize, y * tileSize , tileSize, tileSize);
    }
}

Hope that helps.

I'm not sure I understand why adding tileX and tileY is a bad thing? If you want to draw the whole tileset, one way of doing it is with a couple of for loops like so.

var tileSize = 32;
var x = 10;
var y = 10;

for(var tileX = 0; tileX < x; tileX ++) {
    for(var tileY = 0; tileY < y; tileY++) {
        context.drawImage(image, tileX * tileSize,tileY * tileSize , tileSize, tileSize);
    }
}

JSFiddle Example

Just my preference, but the naming below might make things a bit more clear as well.

var tileSize = 32;
var width = 10;
var height = 10;

for(var x = 0; x < width ; x++) {
    for(var y = 0; y < height; y++) {
        context.drawImage(image, x * tileSize, y * tileSize , tileSize, tileSize);
    }
}

Hope that helps.