Change Data Attribute json value

Question

i want to change specific value of json array. for detail i have this dom :

<input class="fileupload" type="file" data-form-data='{"table_reference": "data_monitoring", "table_token" : "X43sd"}'>

i know how to update the data attribute using jquery using this code : $(this).attr('key', 'value')

but how to change specific key in data attribute, for example on above dom I need to change the table_token value

thank for any suggestion

guest271314 · Accepted Answer · 2017-10-13 01:49:39Z

3

You can use .data() with property reference to set the specific property to a value

$(".fileupload").data().formData.table_token = 123;

console.log($(".fileupload").data().formData);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="fileupload" type="file" data-form-data='{"table_reference": "data_monitoring", "table_token" : "X43sd"}'>

If requirement is to set data-* which will be reflected in HTML you can use HTMLElement.dataset

var new_token = "abc";

let data = JSON.parse($(".fileupload")[0].dataset.formData);

data.table_token = new_token;

$(".fileupload")[0].dataset.formData = JSON.stringify(data);

edited Oct 13, 2017 at 1:49

answered Oct 13, 2017 at 0:51

guest271314

1

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

6 Comments

Solomon Tam Over a year ago

I think you mean .data().formData.table_token

guest271314 Over a year ago

@navotera Not sure what you mean? The property is set at the .data() object

navotera Over a year ago

please check my fiddle

guest271314 Over a year ago

Yes, the .data() is set at the jsfiddle

navotera Over a year ago

sorry table_token value never changed when i click 'save' button

|

Collectives™ on Stack Overflow

Change Data Attribute json value

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related