HTML Script capturing text and performing events with its own value

Question

I'm trying to capture the value of 2 text inputs and performs functions when the user press enter key.

I'm using Internet Explorer 11.

<script type="text/javascript">
  function myFuncion(arg1, arg2) {
    window.alert("arg1:" + arg1 + ", arg2:" + arg2);
  }
</script>

Now, the text inputs code

<input type="text" size="6" name="nameAnotherText" id="idAnotherText" value=""
    onkeydown = "if (event.keyCode == 13) {
      myFuncion('" + document.getElementById("idText").textContent + "', '" 
        + document.getElementById('idAnotherText').value + "');
      }"
/>


<input type="text" size="6" name="nameText" id="idText" value=""
    onkeydown = "if (event.keyCode == 13) {
      myFuncion('" + document.getElementById("idText").textContent + "', '" 
        + document.getElementById('idAnotherText').value + "');
      }"
/>

Is it not working.

Unfortunately this not works:

<button onclick="myFuncion('" +
            document.getElementById(\"idAnotherText\").textContent + "', '" +
            document.getElementById(\"idText\").textContent + "')" >Press Me</button>
<button onclick="myFuncion(" +
            document.getElementById(\"idAnotherText\").textContent + ", " +
            document.getElementById(\"idText\").textContent + ")" >Press Me</button>
<button onclick="myFuncion(" +
            document.getElementById('idAnotherText').textContent + ", " +
            document.getElementById('idText').textContent + ")" >Press Me</button>

How solve this?

Or something https://stackoverflow.com/a/155272/811293 but is not working:

Answer 1

Remove quotes from the function arguments. You also have to use value instead of textContent to grab the values from input fields in both cases. Try the following:

function myFuncion(arg1, arg2) {
  window.alert("arg1:" + arg1 + ", arg2:" + arg2);
}

<input type="text" size="6" name="nameAnotherText" id="idAnotherText" value=""
    onkeydown = "if (event.keyCode == 13) {
      myFuncion(document.getElementById('idText').value, document.getElementById('idAnotherText').value);
      }"
/>

<input type="text" size="6" name="nameText" id="idText" value=""
    onkeydown = "if (event.keyCode == 13) {
      myFuncion(document.getElementById('idText').value, document.getElementById('idAnotherText').value);
      }"
/>

Writing JavaScript in HTML is not a good idea. You might do the following which is more cleaner:

function myFuncion(event) {
  if (event.keyCode == 13) {
    var txt1 = document.getElementById('idText').value;
    var txt2 = document.getElementById('idAnotherText').value;
    window.alert("txt1:" + txt1 + ", txt2:" + txt2);
  }
}

<input type="text" size="6" name="nameAnotherText" id="idAnotherText" value="" onkeydown = "myFuncion(event);"/>

<input type="text" size="6" name="nameText" id="idText" value="" onkeydown = "myFuncion(event);"/>