Get width of element using Javascript - syntax help

#1

Attempting to use Javascript to search for the name of an image in my project (passed through repeater item data) and store the objects width in pixels.

I was able to use this code from a different forum post to work:
javascript: $axure.setGlobalVariable(“Ret1”,$axure(’@[[Item.myImageLink]]’).$().find(“img”).attr(“src”));

This successfully finds the image’s src path and outputs: “images/page_1/myImageName_u43.png”

I’m trying to modify this code to get the width of that image - here is my novice attempt:
javascript:alert($axure(’@[[Item.myImageLink]]’).width);

This returns a long-winded function, and I’m sure I have a syntax error for getting the result I’m looking for - any thoughts?

#2

Why do you need to use javascript calls for this? You can get the .width property for any widget directly in Axure.

…Maybe you are trying to resize an image widget in your repeater by accessing file metadata? As is, [[Item.myImageLink]] is only a text value, not the image file itself. Have you tried just appending “.width” or “.width()” to the end of your first call which returns a pointer to the file? See this javascript solution from Stack Overflow

If you are trying to load images of different dimensions into an Image widget in a repeater, a more straightforward approach is to represent width (and height if needed) as separate column(s) in your repeater datasheet, and just manually enter the dimensions when you specify the image in the repeater datasheet. Then, just after (or before) your Set Image action in Item Loaded use that column’s data in a Set Size action.

#3

In my case, the image is being pulled from a dynamic dataset and cannot be feasibly targeted. I’m looking to create a more streamlined way to target the image and get the width (vs creating a bunch of conditions or referencing a repeater with the information manually typed in)

This is the example I am pulling from:

The key line of code in this example:
javascript: $axure.setGlobalVariable(“Ret1”,$axure(’@[[This.name]]’).$().find(“img”).attr(“src”));

@huban wrote the original solution. Is there a way I can take this same approach, but instead of storing the image’s src path, I can modify the javascript to store the width instead?

#4

upload your .rp file please.

#5

Here is a very stripped down version (that isn’t referencing repeater data as explained below). The example uses javascript to find the image source of a clicked image (and attempts to find the width, but I am failing to do so)

I’m aware I could directly reference the width of the different images in this example using local variables, but am hoping to find a solution using javascript.

Image Copying_v2.rp (69.4 KB)

#6

OK,I saw your javascript code is:

javascript:$axure.setGlobalVariable(“Ret2”,$axure(’@[[This.name]]’).width);

change it to this:

javascript:$axure.setGlobalVariable(“Ret2”,$axure(’@[[This.name]]’).width());

then Ret2 will be correct.

@mbc66 has already told you.

#8

This is exactly what I needed - simply adding “()” after width did the trick.

Thanks @Jorkin and @mbc66 - sorry for not catching the solution within the original post. Really appreciate the help.