CODEWITHSUNDEEP
jquerycsshtml
anam
anam

Reputation: 3913

save data in html element dynamicaly

I am dynamically reading valued from db and append element in DOM,I below code i am reading one field and storing it in id e.g 11 in below sample . however there is one more field in table called comments , as what should i set it on html element so that i don't need to fire db query again for comment ??

 <div id="selectionbox" style="display:inline-block">
    <img style="display:inline-block" id="activity_image11" src="../images/Desert.jpg" width="100" height="100">
    <input type="checkbox" class="class1" id="11" style="display:inline-block">
</div>

I am getting many selectionbox as above which i am appending in DOM ,later i am fetching selected checkbox using ,

temp.push($( "div#"+this.id ).find( "input[type=checkbox]:checked" ).map(function() {
        return this.id
    }).get());

My problem is if i will store comment in data-value="10" then how can i fetch those data fields???

Upvotes: 0

Views: 452

Answers (2)

Rakesh Juyal
Rakesh Juyal

Reputation: 36749

You can add one extra attribute in checkbox [data-value]. Your code will look like this:

<div id="selectionbox" style="display:inline-block">
    <img style="display:inline-block" id="activity_image11" src="../images/Desert.jpg" width="100" height="100">
    <input type="checkbox" class="class1" id="11" data-comment="some comments for 11" style="display:inline-block">
    <input type="checkbox" class="class1" id="12" data-comment="some comments for 12" style="display:inline-block">
    <input type="checkbox" class="class1" id="13" data-comment="BC" style="display:inline-block">
</div>

Then later you can fetch this value from checkbox:

$("#selectionbox  input[type=checkbox]:checked").attr("data-comment");

P.S. If comment data is big then instead of using new attribute I would recommend using jQuery data

Upvotes: 1

Praveen
Praveen

Reputation: 56509

If I understood correctly, you're trying to fetch the values from data-value

You can simple fetch data values like

$('#comments').data('value');

or 

 $('#comments').attr('data-value');

Upvotes: 1

Related Questions