Putting <div> inside <td> dynamically using Jquery (vai xml parsing)
Question
i need to get id of div which i am creating inside a my code is:
tab_Div = $ ('#id_of_table')
$(xml).find('something').each(function(i){
value1 = $(this).attr('some_attribute');
newID = "divID_"+i;
var my_row = $('<tr><td>'+value1+'</td><td><div id="'+newID+'"></div></td></tr>').appendTo(tab_Div);
drawBar(value1,newID);
//This function draws progressbar of "value1" in the div whose id is "newID"
});
theoretically, this function should add a row to a table having two cells 1. which display value 2. progressbar of that value.
but i think , it has a problem with 'id' of 'Div'. and "newID" is a string not 'id' of any obj
can anybody help me on this ???
pls tell me how can i draw desired table (ie with progressbar in one cell)
code of drawBar()
function drawBar(no,eid)
{
$(eid).progressbar({value: no});
$(eid).css({background: '#99FF66'});
$(eid+" > div").css({background: '#009900'});
$(eid+" > div").css({border: 'none'});
}
drawbar function just draws a jqueryUI progress bar into DIv which it receives at "eid"
3 answers
solution1
1 2011-12-21 08:48:48
hi i have seen your code and found that you have not closed the div tag inside your td EDIT: not only the div tag is not closed but u have also passed wrong variable of table tab_Div you have passed tab_div
tab_Div = $ ('#id_of_table')
$(xml).find('something').each(function(i){
value1 = $(this).attr('some_attribute');
newID = "divID_"+i;
var my_row = $('<tr><td>'+value1+'</td><td><div id="'+newID+'" ></div></td></tr>').appendTo(tab_Div);
drawBar(value1,newID);
EDIT AFTER THE COMMENT:
FOLLOWING IS THE CODE:
<body>
<table id="id_of_table" style="width:50%; border:1px solid red; float:left" >
</table>
<script type="text/javascript" >
$(document).ready(function(){
tab_Div = $ ('#id_of_table');
for (var i =1; i<=10; i++){
value1 = "test";
newID = "divID_"+i;
$('<tr><td>'+value1+'</td><td><div id="'+newID+'" >i m inside div </div></td></tr>').appendTo(tab_Div);
}
//drawBar(value1,newID);
});
</script>
</body>
The above code work fine, when u are appending it to table why are you passing it to the variable my_row not required. try my code in HTML page, remember to add jQuery file.
solution2
0 2011-12-21 08:29:49
the easiest way i've found to generate a unique enough id in javascript is to get properties from a Date object.
var date = new Date();
var id = "" + date.getHour() + date.getMinutes() + date.getSeconds() + date.getMilliseconds();
to track IDs that have been created you can use an array
var _ids= new Array();
...
$(xml).each(function(i) {
...
newID = "divID_"+i;
_ids.push(newID);
});
then, when you need to access the divs you can just go through the array
solution3
0 2011-12-21 08:44:17
i think this code is wrong
<div id="'+newID+'"</div>
please change it to
<div id='+newID+'></div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.