1

I'm a complete beginner, so after several hours of pasting working scripts into my WP setup without any result, I turn to help. I'm desperate and out of time :(

I'm trying to update a form field based on the input of another form field (first is a select menu, second is a regular text-input). It's a Wordpress / Woocommerce installation with the fields generated by a plugin so I can't control the output. The fields only have names (no IDs) and all examples I find use IDs.

Form code

<select class="addon addon-select" name="addon-8-choose-a-player-0">

                <option value="">None</option>

                <option data-raw-price="200" data-price="200" value="player-1-1">Player 1</option>
                <option data-raw-price="200" data-price="200" value="player-2-2">Player 2</option>
                <option data-raw-price="200" data-price="200" value="player-3-3">player 2</option>

</select>

<input type="text" class="input-text addon addon-custom" data-raw-price="100" data-price="100" name="addon-8-name-100-1[0]" value="">

jQuery code 

jQuery(document).ready(function( $ ) {

    function onchange() {
        var box1 = $("select[name='addon-8-choose-a-player-0]");
        var box2 = $("#addon-8-name-100-1[0]");
        box2.val(box1.val());
    }
    $("select[name='addon-8-choose-a-player-0]").on('change', onchange);
});
Per
  • 97
  • 1
  • 1
  • 8

1 Answers1

1

Maybe something you are looking for:

jQuery(document).ready(function( $ ) {

    function onchange() {
        var box1 = $("select[name=addon-8-choose-a-player-0]");
        var box2 = $("input[name*=addon-8-name-100-1]");
      console.log(box1);
            console.log(box2);
        box2.val(box1.val());
    }
    $("select[name=addon-8-choose-a-player-0]").on('change', onchange);
});

See the codepen: https://codepen.io/anon/pen/JvPKGj

Tan Duong
  • 2,124
  • 1
  • 11
  • 17
  • First, thank you for the quick answers <3 This made the trick. I also found a bug in my own code (the first ' in the select name for box1) But due to the lack of control of the plugin. This adds the value of the select into the input field. Is there a way to add the text of the option instead? – Per Apr 17 '18 at 08:32
  • 1
    For more information. You can check here https://stackoverflow.com/a/1107264/3085279 – Tan Duong Apr 17 '18 at 08:34
  • 1
    Cool, thx @Tan Duong for that link. Will read up on that. So much to learn... :) – Per Apr 17 '18 at 08:39