I figured it out. Had to hack on the CreateDYnamicServiceLayer in utils.js a bit. Here's the result. But when I click on the features they don't display their little window, so that's next!
function CreateDynamicServiceLayer(layerURL, layerIndex, layerId, isVisible, displayName) {
var imageParams = new esri.layers.ImageParameters();
var lastindex = layerURL.lastIndexOf('/');
imageParams.layerIds = [layerIndex];
imageParams.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;
var dynamicLayer = layerURL.substring(0, lastindex);
var baseLayerURL = layerURL.substring(0,layerURL.lastIndexOf('?')); //kb - is without token.
var token = layerURL.substring(layerURL.lastIndexOf('?')+1, layerURL.length); //kb - is "token=abcxyz"
token = token.substring(token.lastIndexOf('=')+1,token.length);
dynamicLayer = dynamicLayer + "?token="+token;
var dynamicMapService = new esri.layers.ArcGISDynamicMapServiceLayer(dynamicLayer, {
id: layerId,
imageParameters: imageParams,
visible: isVisible
});
var querySeparator = layerURL.lastIndexOf('?') ? '&' : '?'; //kb
dojo.io.script.get({
url: layerURL + querySeparator + 'f=json', //kb updated
preventCache: true,
callbackParamName: "callback",
timeout: 10000,
load: function (data) {
layersCounter++;
if (layersCounter == layers.length) {
HideProgressIndicator();
}
var table = document.createElement("table");
var tbody = document.createElement("tbody");
table.appendChild(tbody);
var tr = document.createElement("tr");
tbody.appendChild(tr);
var td = document.createElement("td");
var checkbox = CreateCheckBox(layerId, layerIndex, false);
checkbox.onclick = function () {
if (this.getAttribute("state") == "check") {
this.src = "images/unchecked.png";
this.setAttribute("state", "uncheck");
dynamicMapService.hide();
map.infoWindow.hide();
}
else {
this.src = "images/checked.png";
this.setAttribute("state", "check");
ShowProgressIndicator();
dynamicMapService.show();
map.infoWindow.hide();
selectedGraphic = null;
map.getLayer(tempLayerId).clear();
map.getLayer(tempParcelLayerId).clear();
}
HideProgressIndicator();
};
td.appendChild(checkbox);
tr.appendChild(td);
td = document.createElement("td");
var img = document.createElement("img");
img.src = baseLayerURL + '/images/' + data.drawingInfo.renderer.symbol.url;
if (isMobileDevice) {
img.style.width = "44px";
img.style.height = "44px";
}
else {
img.style.width = "20px";
img.style.height = "20px";
}
td.appendChild(img);
tr.appendChild(td);
td = document.createElement("td");
td.appendChild(document.createTextNode(displayName));
tr.appendChild(td);
dojo.byId('divLayers').appendChild(table);
},
error: function (error) {
layersCounter++;
if (layersCounter == layers.length) {
HideProgressIndicator();
}
}
});
return dynamicMapService;
}