mootools inject function

Question

I have span which i crate like this:

   new Element('span', {'class': 'file-img', 'html': 'Image'})

I want to inject image to it:

  var my_img = new Element ('img' , {'src' :'uploading/abc.jpg' , 
   'style' : 'width:50px; text-align:left' }).inject(file-img, 'top') ;

It's not working.

Thanks for your help.

Answer 1

What is file-img ??? it looks like a variable but actually it tries to subtract img from file ... looks like the error is there. Variables can't have dashes in their name in javascript

Answer 2

this would work (mt 1.2+):

new Element('span', {
    'class': 'file-img'
}).inject($(document.body)).adopt(new Element("img", {
    'src' :'uploading/abc.jpg',
    styles: {
        width: 50,
        textAlign: "left"
    }
});

but if you are trying to use file-img as a reference to the CSS class of the span you have created, then you need to use document.getElement("span.file-img") as your target container. and - don't use - in the class names, if you can help it. use _ instead, - implies subtraction and may have an effect on CSS selectors.

another way to do this is to assign it to a variable

for example,

var file_img = new Element("span" ... );
... 
someObj.inject(file_img);