Syntax Error while String concatenating with jQuery

Question

I want to push the Javascript object using a loop And Getting the value of input using jQuery.

var data = {name: "Grace"};

$("#test").on('change', function () {
  
      console.log($('"#test'+1+'T"').val());
  
      for(var i=1; i<= 2; i++){
        data['Thomas'+i+'Shelby'] = $('"#test'+i+'T"').val();
      }
      console.log(data);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<input type="text" id="test1T">
<input type="text" id="test2T">
<input type="text" id="test">

Syntax error, unrecognized expression: "#test1T"

**Expected Output: **

If user input Arthur in #test1T, John in #test2T and Micheal in #test.

Then It should console log following object:

{
 name: "Grace",
 Thomas1Shelby: "Arthur",
 Thomas2Shelby: "John",
}

Where is the Micheal ?

user12582716
– user12582716

2021-01-20 08:54:31 +00:00
Commented Jan 20, 2021 at 8:54 — user12582716
– user12582716, Commented Jan 20, 2021 at 8:54

Justinas · Accepted Answer · 2021-01-20 08:59:21Z

2

It's error in query selector. Don't put " inside.

change $('"#test'+i+'T"').val()
to be $('#test'+i+'T').val()

var data = {name: "Grace"};

$("#test").on('change', function () {
  
      console.log($('#test'+1+'T').val());
  
      for(var i=1; i<= 2; i++){
        data['Thomas'+i+'Shelby'] = $('#test'+i+'T').val();
      }
      console.log(data);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="test1T">
<input type="text" id="test2T">
<input type="text" id="test">

edited Jan 20, 2021 at 8:59

answered Jan 20, 2021 at 8:51

Justinas

43.9k5 gold badges72 silver badges108 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mplungjan · Accepted Answer · 2021-01-20 08:56:37Z

1

Quotes issues. A valid ID selector would look like

$('#test1T') or $('#test'+i+'T')

I suggest template literals

const data = {
  name: "Grace"
};

$("#test").on('change', function() {
  for (var i = 1; i <= 2; i++) {
    data[`Thomas${i}Shelby`] = $(`#test${i}T`).val();
  }
  console.log(data);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<input type="text" id="test1T">
<input type="text" id="test2T">
<input type="text" id="test">

answered Jan 20, 2021 at 8:56

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Collectives™ on Stack Overflow

Syntax Error while String concatenating with jQuery

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related