How can I tie a String value to a
-tag, as a hidden parameter?

Question

I am extracting data from a database that I do not administer. It is a single list, and the important values are:

Folder Name
Index Integer
UID (unique identification) String
Filename

I have successfully created a Tree-structured browser, based on a model using <ul> and <li> tags. I had also implemented action listeners on double click, that found the id, and acted accordingly. The identifications were stored, and found as a value-parameter to the individual <li>'s that represented the leaves, or filenames.

However it turns out that the Index numbers are not unique. I expected them to be, even though there were a column for UID's. I tried to set the value to be the UID String. It works in my browser, as a snippet of my generated HTML code shows:

<li role="treeitem" value="1581f20c-0ef9-4c21-a8ab-a407da310cf5" ... >

However, when I retrieve the value, and save it to database, it only gets the numeric value that appears ahead of the first non-numeric character. In this case 1581. I've checked, and come to the conclusion that the value-parameter only accepts numeral values, which really sucks for me...

Are there any other ways to tie a non-displayed UID String to a HTML-list element?

EDIT 2:

I removed my previous edit, due to a realization of what my misunderstanding was. Custom data tags needs the syntax "data-variablename", and when retrieving it, I should ommit the "data-", and just get the variablename.

If your clients are all using up-to-date browsers, you could try the "data" attributes. For instance: `
WOW, that was a lot of answers, and fast! I was unaware of the option of defining custom data tags in HTML, and I am extremely happy to learn about them. I need to make it compatible for IE8, so I'll read about it's support before setling on a solution, and accepting an answer. — jumps4fun, Jun 16 '14 at 13:04

Ja͢ck · Accepted Answer · 2014-06-16T13:15:20.677

5

The value property of <li> elements is an ordinal value and is exclusively used in <ol> context (i.e. numbered lists).

Instead, you can add this piece of information as a data item:

<li role="treeitem" data-value="abc-foo-bar" ...>

Then, use this to access the value again:

$(el).data('value')

See also: .data()

jQuery adds a special property to each element that uniquely identifies an object in "reserved" memory that will contain your data, so you don't have to worry about overwriting anything of the element itself.

edited Jun 16 '14 at 13:15

answered Jun 16 '14 at 12:58

Ja͢ck

170,779
38
263
309

I settled on this answer, because of it's short simple and yet specific, and explained format. In addition, it uses JQuery, which I implied i was using through the tags. f I am correct, that means it will work with more browsers, then some of the other answers, which require HTML-5. – jumps4fun Jun 17 '14 at 08:21
Should $(el) be $(li) ? I tried to use this $(el).data('value'), also tried $.el.data('value') both returned errors. – mcv Dec 21 '16 at 13:40
@mcv `el` in this case stands for the referenced element; it's just a variable in your code. – Ja͢ck Dec 21 '16 at 20:01

score 0 · Answer 2 · answered Jun 16 '14 at 12:58

0

value is already an html attribute. So the browser try to fix your value when you use it. Try to use a custom attribute like data-value :

<li role="treeitem" data-value="1581f20c-0ef9-4c21-a8ab-a407da310cf5" ... >

answered Jun 16 '14 at 12:58

Magus

14,796
3
36
51

score 0 · Answer 3 · answered Jun 16 '14 at 12:58

0

Try this:

HTML:

<li data-uid="[your-UID-here]">

jQ:

$("li").data("uid");

answered Jun 16 '14 at 12:58

thykka

540
2
12

score 0 · Answer 4 · answered Jun 16 '14 at 12:59

0

You can make use of jQuery .data() function.

$(element).data(key, value)

answered Jun 16 '14 at 12:59

T J

42,762
13
83
138

How can I tie a String value to a -tag, as a hidden parameter?

4 Answers4

How can I tie a String value to a
-tag, as a hidden parameter?