I have created a jsfiddle click here
but I am not able to figure out how to implement ctrl+click on the select options.
in the project js file after calling retrieveSelectedClass
, I have some http request to get the data from server side and display it in ui. I am using a library to display the code, Codemirror
.
var data = {
apexClassName: $scope.selectedName.name
};
var config = {
params: data
};
$http.get("/getApexBody", config).then(getApexBodyCallback, getApexBodyErrorCallback);
function getApexBodyCallback(response) {
if (response.data) {
$scope.apexClassWrapper = response.data;
if (globalEditor1) {
globalEditor1.toTextArea();
}
setTimeout(function(test) {
var editor = CodeMirror.fromTextArea(document.getElementById('apexBody'), {
lineNumbers: true,
matchBrackets: true,
styleActiveLine: true,
extraKeys: {
".": function(editor) {
setTimeout(function() {
editor.execCommand("autocomplete");
}, 100);
throw CodeMirror.Pass; // tell CodeMirror we didn't handle the key
}
},
gutters: ["CodeMirror-lint-markers"],
lint: true,
mode: "text/x-apex"
});
editor.markClean();
editor.on("keyup", function(cm, event) {
var keyCode = event.keyCode || event.which;
if (!ExcludedIntelliSenseTriggerKeys[(event.keyCode || event.which).toString()]) {
if (timeout) clearTimeout(timeout);
timeout = setTimeout(function() {
editor.showHint({
hint: CodeMirror.hint.auto,
completeSingle: false
});
}, 150);
}
});
globalEditor1 = $('.CodeMirror')[0].CodeMirror;
}), 2000
document.getElementById('saveBtn').style.visibility = 'visible';
$scope.isPaneShown = false;
}
}
HTML
<div id="container">
<select ng-model="selectedName" ng-change="retrieveSelectedClass(selectedName, '{{selectedName}}')" ng-options="item.name group by item.groupName for item in names"
class="code-helper" id="code-helperId">
<option value="">Select Option</option>
</select>
</div>
<div style="padding: 1px; position: absolute; margin: 0px; left: 0px; right: 0px; top: 30px; bottom: 30px; width: 100%; height: auto; " loading-pane="isPaneShown">
<textarea ng-model="apexClassWrapper.body" id="apexBody" name="apexBody" style="display: none;" readonly="true">{{apexClassWrapper.body}}</textarea>
</div>
The issue is even if I catch the ctrl click event like this:
if ($window.event.ctrlKey) {}
inside my retrieveSelectedClass
, how will it open same html page in the new tab with the option value already selected in the selection menu
But I am not able to understand how will I implement ctrl+click on the option select value to get it open in a new tab, with the file name selected in the selection dropdown and the text area showing the body of the retrieved class?