Question

50

Create an Array from a single HTML5 data- attribute

rated 0 times [ 51] [ 1] / answers: 1 / hits: 17944 / 10 Years ago, sat, march 1, 2014, 12:00:00

I have this HTML:

<section id=SSID data-texts='Text1', 'Text2', 'Text3'></section>

I want to create an Array variable in jQuery and my jQuery code is:

$(document).ready(function() {

    var Selection = $(#SSID).data(texts);

    var Texts = [ Selection ];



    console.log(Texts.length);

});

For my example, the result I expect is:

Texts[0] = 'Text1'

Texts[1] = 'Text2'

Texts[2] = 'Text3'

...and that the length of the array Texts is 3.

However, what I am seeing is that the length of Texts is 1 and that the entire string is being loaded into Texts[0]:

Texts[0] = 'Text1', 'Text2', 'Text3'

I think my problem is being caused by the (quotation mark) characters. How can overcome this problem and achieve my objective?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

ignacio

Add To Favorites

Follow

Total Points: 467

Total Questions: 128

Total Answers: 79

Location: Luxembourg

Member since Tue, Mar 14, 2023

1 Year ago

ignacio questions

1 `npm install` fails on node-gyp rebuild with `env: python: No such file or directory` on mac pro m1

Tue, Aug 16, 22, 00:00, 2 Years ago

1 Invalid configFile (Cypress 10.0) - cannot find module

Fri, Jun 10, 22, 00:00, 2 Years ago

1 Switch' is not defined react/jsx-no-undef

Fri, Jun 4, 21, 00:00, 3 Years ago

1 Adding Header & Footer for all screens in JSPDF

Fri, Apr 23, 21, 00:00, 3 Years ago

1 Find the total of members online/offline Discord.js

Wed, Jul 22, 20, 00:00, 4 Years ago

View All

answered 10 Years ago braidenv · Accepted Answer

You can use JSON.parse()

HTML :

<section id=SSID data-texts='Text1, Text2, Text3'></section>

JQUERY :

var Selection = JSON.parse('[' + $(#SSID).data(texts) + ']');

Fiddle Demo

or

HTML :

<section id=SSID data-texts='Text1, Text2, Text3'></section>

JQUERY :

var Selection = JSON.parse($(#SSID).data(texts));

FYI : But it would be better to store the actual JSON as the data attribute value. For eg : data-texts='[Text1, Text2, Text3]' and parse it directly.

UPDATE : Or you can do it using Array#map method and String#split method.

var Selection = $(#SSID).data(texts).split(',').map(JSON.parse);



console.log(Selection);

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

<section id=SSID data-texts='Text1, Text2, Text3'></section>