diff --git a/editors/demo/src/HHMI/HHMI.js b/editors/demo/src/HHMI/HHMI.js
index 287c402de3680c43684b09aa8eeade07e3f39878..5853fc581bebc801c9ddc10b0df5a177f723ac27 100644
--- a/editors/demo/src/HHMI/HHMI.js
+++ b/editors/demo/src/HHMI/HHMI.js
@@ -39,8 +39,10 @@ const t = `<p class="paragraph"></p>
 
 const Hhmi = () => {
   const [submited, isSubmited] = useState(false);
+  const [readOnly, isReadOnly] = useState(false);
   const submitQuestions = () => {
     isSubmited(true);
+    isReadOnly(true);
   };
 
   return (
@@ -52,7 +54,7 @@ const Hhmi = () => {
         customValues={{ showFeedBack: submited }}
         fileUpload={file => renderImage(file)}
         value={t}
-        // readonly
+        readonly={readOnly}
         layout={HhmiLayout}
         onChange={source => console.log(source)}
       />
diff --git a/wax-prosemirror-services/src/WaxToolGroups/MultipleDropDownToolGroupService/DropComponent.js b/wax-prosemirror-services/src/WaxToolGroups/MultipleDropDownToolGroupService/DropComponent.js
index 3091944602cf8a50ce7e7328fffb6d9f4886cdfc..d92127eb15375b2fba6b42c58bac40129c3fcd9b 100644
--- a/wax-prosemirror-services/src/WaxToolGroups/MultipleDropDownToolGroupService/DropComponent.js
+++ b/wax-prosemirror-services/src/WaxToolGroups/MultipleDropDownToolGroupService/DropComponent.js
@@ -48,6 +48,9 @@ const DropComponent = ({ title, view, tools }) => {
   const { state } = view;
 
   const [label, setLabel] = useState(null);
+  const isEditable = main.props.editable(editable => {
+    return editable;
+  });
 
   const dropDownOptions = [
     {
@@ -83,7 +86,8 @@ const DropComponent = ({ title, view, tools }) => {
     });
   }, [activeViewId]);
 
-  const isDisabled = tools[0].select(state, activeView);
+  let isDisabled = tools[0].select(state, activeView);
+  if (!isEditable) isDisabled = false;
 
   const onChange = option => {
     tools[option.value].run(main, context);