diff --git a/resources/js/components/fieldtypes/CodeFieldtype.vue b/resources/js/components/fieldtypes/CodeFieldtype.vue
index ce0c3964a5..70aec4ab29 100644
--- a/resources/js/components/fieldtypes/CodeFieldtype.vue
+++ b/resources/js/components/fieldtypes/CodeFieldtype.vue
@@ -5,7 +5,7 @@
     <div class="code-fieldtype-container" :class="[themeClass, {'code-fullscreen': fullScreenMode }]">
         <div class="code-fieldtype-toolbar">
             <div>
-                <select-input v-if="config.mode_selectable" :options="modes" v-model="mode" class="text-xs leading-none" />
+                <select-input v-if="config.mode_selectable" :options="modes" v-model="mode" :is-read-only="isReadOnly" class="text-xs leading-none" />
                 <div v-else v-text="modeLabel" class="text-xs font-mono text-gray-700"></div>
             </div>
             <button @click="fullScreenMode = !fullScreenMode" class="btn-icon h-8 leading-none flex items-center justify-center text-gray-800" v-tooltip="__('Toggle Fullscreen Mode')">
diff --git a/resources/js/components/fieldtypes/markdown/MarkdownFieldtype.vue b/resources/js/components/fieldtypes/markdown/MarkdownFieldtype.vue
index 9daeedd789..c3a834279a 100644
--- a/resources/js/components/fieldtypes/markdown/MarkdownFieldtype.vue
+++ b/resources/js/components/fieldtypes/markdown/MarkdownFieldtype.vue
@@ -190,7 +190,11 @@ export default {
 
         mode(mode) {
             if (mode === 'preview') this.updateMarkdownPreview();
-        }
+        },
+
+        readOnly(readOnly) {
+            this.codemirror.setOption('readOnly', readOnly ? 'nocursor' : false);
+        },
 
     },