Editable dropdown list

Allow to add editable dropdown list and make editable only if "Other" is selected.

HTML

<span>Dropdown using SELECT and INPUT:</span>
<div class="select-editable">
    <select onchange="updateEditable(this)" data-onload= "makeEditable(this)" >
        <option value=""></option>
        <option value="115x175 mm">115x175 mm</option>
        <option value="120x160 mm">120x160 mm</option>
        <option value="120x287 mm">120x287 mm</option>
        <option value="Other">Other</option>
    </select>
    <input type="text" name="format" value="" />
</div>
<span>Dropdown using DATALIST and INPUT:</span>
<div class="select-editable">
    <input list="browsers" name="format" value=""  />
    <datalist id="browsers">
      <option value="Internet Explorer">
      <option value="Firefox">
      <option value="Chrome">
      <option value="Opera">
      <option value="Safari">
      <option value="Other">
    </datalist>    
</div>

CSS

.select-editable {
     position:relative;
     background-color:white;
     border:solid grey 1px;
     width:120px;
     height:18px;
 }
 .select-editable select {
     position:absolute;
     top:0px;
     left:0px;
     font-size:14px;
     border:none;
     width:120px;
     margin:0;
 }
 .select-editable input {
     position:absolute;
     top:0px;
     left:0px;
     width:100px;
     padding:1px;
     font-size:12px;
     border:none;
 }
 .select-editable select:focus, .select-editable input:focus {
     outline:none;
 }

JavaScript

$(document).ready(function(){
   $('[data-onload]').each(function(){
    eval($(this).data('onload'));
	});
});

function updateEditable(elm) {
	elm.nextElementSibling.value=elm.value;
  console.log(elm.value);
  makeEditable(elm);
}
function makeEditable(elm) {
  debugger;
	var nextSbl;
	if ($(elm).is("select")) {
   	nextSbl = elm.nextElementSibling;
    if (elm.value == "Other") {
      nextSbl.readOnly = false;
    } else {
      nextSbl.readOnly = true;
    }
  } else {
    if (elm.value != "Other" && !$(elm).attr("keypressOff")) {
    	$(elm).keypress(function(event) {
        console.log("keypress preventd")
      	event.preventDefault();
      })
    } else {
    	$(elm).off("keypress");
      $(elm).attr("keypressOff", true);
      console.log("keypress event removed")
    }
  }
}