0

Can anyone see any issues with the code below that would stop it working on a 'real' website? I have also tested in CodePen and it works there, too.

The code is meant to run on each change of a selecter, find an input field with a similar id (plus 'Txt' at the end) and then copy the value into this.

No errors are output to console. Note that console.log() has been used during development only to ensure that variables are being assigned/changed as appropriate. They would be removed once published.

Even works in StackOverflow's sample:

  $('select[name]').change(function(){
    var txt = "Txt", 
    selectName = this.name,
    inputName = selectName.concat(txt);
    console.log(selectName);
    console.log(inputName);
    document.getElementById(inputName).value= (this.value);
  });
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Testing</title>  
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js" type="text/javascript"></script>
    
<script type="JavaScript">

</script>
  </head>

  <body>
    <button id="copy">copy</button>
    <form id="form1">
      <select id="selecter123" name="selecter123" size="5" style="width: 400px;">
        <option value="01">001</option>
        <option value="02">002</option>
        <option value="03">003</option>
        <option value="04">004</option>

      </select>
      <input id="selecter123Txt" name="selecter123Txt" type=text>
    </form>

    
    <br><br><br>
    
    <form id="form3">
      <select id="selecter456" name="selecter456" size="5" style="width: 400px;">
        <option value="01">001</option>
        <option value="02">002</option>
        <option value="03">003</option>
        <option value="04">004</option>

      </select>
    </form>
    <form id="selecter456Txt6">
      <input id="selecter456Txt" name="selecter456Txt" type=text>
    </form>
    
  </body> 
</html>
Callum Corrigan
  • 45
  • 9
  • 1
    Head renders before the body so your selector finds no elements.... `console.log($('select[name]').length)` – epascarello Mar 07 '23 at 19:37
  • For anyone else having this issue, the position of the code in my file made no difference - I had it at the bottom of the file, as I do with all my scripts (other than those from external sources). Instead, the 'defer' option [in this post](https://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element) was the solution. – Callum Corrigan Mar 08 '23 at 19:41

0 Answers0