禁用手动键盘输入JavaScript / Oracle JET

Question

I'm developing an application with Oracle JET framework and I'm using a combobox input as shown in the Oracle JET Cookbook.

How can I disable a manual keyboard input?

I tried to add this in my input but none of this command worked:

onkeypress="return false;"
onkeydown="return false"



<input id="combobox" list="browsers" 
       data-bind="ojComponent: {component: 'ojCombobox', 
                                multiple: true, value: val,
                                rootAttributes: {style:'max-width:20em'}}"/>
<datalist id="browsers">
    <option value="Internet Explorer">Internet Explorer</option>
    <option value="Firefox">Firefox</option>
    <option value="Chrome">Chrome</option>
    <option value="Opera">Opera</option>
    <option value="Safari">Safari</option>
</datalist>

Thank you

Answer 1

As Quentin mentioned in comments section combobox purpose is to provide a combination of text input and dropdown menu.

You can use <oj-select-one> component for your requirement.

<oj-select-one id="basicSelect" value="{{val}}" style="max-width:20em">
   <oj-option value="IE">Internet Explorer</oj-option>
   <oj-option value="FF">Firefox</oj-option>
   <oj-option value="CH">Chrome</oj-option>
   <oj-option value="OP">Opera</oj-option>
   <oj-option value="SA">Safari</oj-option>
</oj-select-one>

Here is the link for component demo Oracle Jet SelectOne Menu Demo

Not sure how it is in jet version you are using but If you wanted to do it with comboxbox only then in jet 5.1 this is working

<oj-combobox-one id="student" 
    value="{{selectedStudent}}" options="[[studentOptions]]"
    onkeydown="return false;">
</oj-combobox-one>

Answer 2

Make use of onkeydown = "return false;" as one of the attributes in the component.

    `<oj-combobox-one id="combobox" value="{{val}}"
        style="max-width:20em" onkeydown="return false;">
        <oj-option value="Internet Explorer">Internet Explorer</oj-option>
        <oj-option value="Firefox">Firefox</oj-option>
        <oj-option value="Chrome">Chrome</oj-option>
        <oj-option value="Opera">Opera</oj-option>
        <oj-option value="Safari">Safari</oj-option>
     </oj-combobox-one>`

You can try it here: https://www.oracle.com/webfolder/technetwork/jet-400/jetCookbook.html?component=comboboxOne&demo=single