JSFiddle - React, Tailwind, and code Playground
HTML
<h3>Quick lookup for Excel style lettered headings to numerical equivalent</h3>
<label>cell reference:</label>
<input id="testes" maxlength="2" />
<label>numerical value:</label>
<input id="results" />
CSS
* {
font-family: tahoma;
}
input {
width: 25px;
font-size: 16px;
}
JavaScript
$(document).ready(function() {
$("#testes").on("keyup", function(event) {
var str = $(this).val();
if (str.length == 1) {
$("#results").val(get_string_value(str));
} else {
var fstr = str.slice(0,1);
var estr = str.slice(1,2);
$("#results").val(get_string_value(estr) + (get_string_value(fstr) * 26));
}
});
});
function get_string_value(str) {
return str.charCodeAt() - 96;
}