0

Please consider this string:

['2012-2','2012-3','2012-4','2013-1','2013-2','2013-3','2013-4','2014-1']

I return this string from a web method and I want to loop on this values and I write this:

var tr = '<tr><td>Title</td>';
$.each(arrPeriods, function (index, value) {
     tr += '<td>' + value + '</td>';
});
tr += '</tr>';

And I get this error:

JavaScript runtime error: Invalid operand to 'in': Object expected

I think the problem is I should convert the string to an array but I don't know how I can do this. Please help me solve my problem.

8
  • What is a "web method"? Why don't you just return the data in a format that you can use instead? Commented Sep 25, 2018 at 11:09
  • You can return it as array, instead of string Commented Sep 25, 2018 at 11:10
  • I use ASP.Net to get data from server and I should return string Commented Sep 25, 2018 at 11:10
  • You can use split to convert string to array Commented Sep 25, 2018 at 11:11
  • What does it mean you should return string? Is that mandatory ? Commented Sep 25, 2018 at 11:11

3 Answers 3

1

You must replace all your "'" to "\"" Then you can use JSON.parse() for convert your string into an array. Just like this:

var answer = "['2012-2','2012-3','2012-4','2013-1','2013-2','2013-3','2013-4','2014-1']";
answer = answer.split("'").join("\"");

var arrPeriods = JSON.parse(answer);

var tr = $('<tr><td>Title</td></tr>');

$.each(arrPeriods, function(index, value) {
  tr.append('<td>' + value + '</td>');
});

$('table').append(tr);
Sign up to request clarification or add additional context in comments.

8 Comments

Please stop recommending the "fixing" of non-JSON. Fix the source, not the symptoms. According to the question, the OP has access to the backend where this string comes from. It would be much more sensible to just fix the backend to produce proper JSON in the first place.
@str But then this question will not be raised, if backend response can be in array
@SudharshanNair And that would be a good thing right? Fix it properly on the backend instead of adding hacky code to the frontend.
@str Obviously you are correct, But for short time fix, if user needs solution, then this can be applied. All things cannot be changed quick as we think
@Arian Always for converting string to JSON you must use JSON.parse the problem with your string is that is not a valid JSON, please try to valid your JSON so you can convert it without any problem, you can use this page for example: jsonlint.com
|
1

You must use jQuery method .append() instead to add td's after converting your string to an array.

NOTE: I suggest to return an array from backend if possible it will be more efficient. This solution is just a temporary fix for now

var arrPeriods = "['2012-2', '2012-3', '2012-4', '2013-1', '2013-2', '2013-3', '2013-4', '2014-1']";
var myArray = arrPeriods.replace(/\[|\]|'/g, '').split(',');

var tr = $('<tr><td>Title</td></tr>');

$.each(myArray, function(index, value) {
  tr.append('<td>' + value + '</td>');
});

$('table').append(tr);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table border=1></table>

8 Comments

Is that what you looking for Arian ?
I think the problem is I have : '['2012-2', '2012-3', '2012-4', '2013-1', '2013-2', '2013-3', '2013-4', '2014-1']'. I mean the string of array
First thing is its not array, its string
@ZakariaAcharki It looks better now
@ZakariaAcharki Still in your output, we can see brackets for first and last td.
|
-1

See the comments.

var arrPeriods = "['2012-2', '2012-3', '2012-4', '2013-1', '2013-2', '2013-3', '2013-4', '2014-1']";
arrPeriods = arrPeriods.replace(/'/g, '"'); // Clean the string into an acceptable JSON string
arrPeriods = JSON.parse(arrPeriods); // Parse the JSON string

var $tr = $('<tr><td>Title</td></tr>'); // Create the row
var $table = $('<table></table>')
  .append($tr);

// No need to use jQuery's .each
arrPeriods.forEach(function (date) {
  $tr.append('<td>' + date + '</td>');
});

$('body').append($table);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.