adding a div with data()
- by Dizzy Bryan High
Hi people
am generating a list of flash swfs, the information comes from an ajax call which returns a json object which i loop through to create the rows of data using my makeAppRow function.
makeAppRow = function(myData){
var myStr = '<div class="fileEntry">'
myStr = myStr +'<div class="appDate">'+dateFormat(myData.date_swf, "dS mmmm, yyyy, h:MM TT")+'</div>'
myStr = myStr +'<div class="appName">'+myData.name_swf+'</div>'
myStr = myStr +'<div class="appOptions" data>'
myStr = myStr +'<div class="gotoAppBtn" data-options="'+myData+'">Open App</div>'
myStr = myStr +'</div>'
myStr = myStr +'</div>'
$('#appData').append(myStr);
}
I need the json data to be attached to the gotoAppBtn so that when its clicked i can read in the data from the attached json object and use it in my click function, as you can see ive been trying to embed the data using the html5 data but i cant get it to work.
<div class="gotoAppBtn" data-options="'+myData+'">Open App</div>
i have a function so that when the button is clicked it loads in an swf.
$('.gotoAppBtn').live('click', function(){
//alert('button clicked')
var myData = $(this).data("options")
alert('../userfiles/'+myData.id_ugp+'/'+myData.id_swf+'/'+myData.launchfile_swf+'')
console.log(myData);
var flashvars = {};
var params = {};
params.menu = "false";
params.quality = "best";
params.scale = "noscale";
var attributes = {};
attributes.id = "flashAppDisplay";
attributes.name = "flashAppDisplay";
swfobject.embedSWF(
'../userfiles/'+myData.id_ugp+'/'+myData.id_swf+'/'+myData.launchfile_swf+'', 'flashAppDisplay', myData.width_swf, myData.height_swf, myData.version_swf ,"../FAVideo/expressInstall.swf", flashvars, params, attributes)
});
but the data does not seem to be there, any pointers on where i am going wrong, or a better way to achive this???
