Question

I’m working with a shopping cart that has pre-defined codes.
I can’t change the html but can work with the css for the element.
Below is the element info I have to work with.
I would like to duplicate the information the user enters into this element when he leaves the field as another (display only type) text element on the same page.

I was hoping to NOT use Jquery to do this.

Is there a way to do this using value=”” ?

    <input id="ecwid-productoption-12821213-I:0027M_______:00a0:0025_PORTUGU:00caSE" 
    class="gwt-TextBox ecwid-productBrowser-details-optionTextField ecwid-productoption- I:0027M_______:00a0:0025_PORTUGU:00caSE" type="text" maxlwngth="200">

Answer 1

Here is a pure JavaScript solution. This will override an existing onload so you should google “multiple onload simon willison”.

function copyToDest(src, dest) {
    var text = document.getElementById(src).value;
    var destNode = document.getElementById(dest);

    destNode.innerHTML = text;
}

window.onload = function() {
    var srcNode = document.getElementById("ecwid-productoption-12821213-I:0027M_______:00a0:0025_PORTUGU:00caSE");

    srcNode.onblur = function() { copyToDest("ecwid-productoption-12821213-I:0027M_______:00a0:0025_PORTUGU:00caSE", "dest"); };
}