Question

I have a form where users can store and edit their skills in different languages.
I´m using a plugin called “raty” to let users set ratings on their language skills. Spring is used for backend. I store the language ratings in a String[] called languageRatings.

The actual setting of skills is not a problem, however I run into problems when I want to let users edit their language skills. The issue is that the name for the form input is set by the lib provided by raty itself, which means that the input name “languageRatings” does not exist when Spring populates the input fields.

A small example of how raty is initialized:

$('#star').raty({
  scoreName: 'languageRatings'
});

<div id="star"></div>

In an attempt to get around this issue, I created a new hidden input:

<form:hidden path="languageRatings" id="hiddenRatings"/>

My thought was to get Spring to populate this input instead, allowing me to use fetch the values from this input element AFTER the correct names has been set by raty.

The hidden field is populated with an array containing ratings like so:
{5, 4, 2}. I´m not very good with Jquery 🙁 I tried doing like this, but it prints the entire string instead of each array element

$(document).ready(function() {
    var ratings = $('#hiddenRatings').val();
    $.each(ratings, function(index, value) { 
      console.log(index + ': ' + value); 
    });
});

produces

0: {
1: 5
2: ,
3:  
4: 3
5: ,
6:  
7: 2
8: }

How can I extract the values in this array?

Answer 1

As your value is "{5, 4, 2}" you can do something like:

var val = $('#hiddenRatings').val(), // "{5, 4, 2}"
    arr = /\{(.*)\}/.exec(val)[1].split(", ");

$.each(arr, function (index, value) {
    console.log(index + ': ' + value);
});

The RegEx strips the curly brackets and the result is then split by ", ", leaving you with an Array containing ["5", "4", "2"].