AS file not recognizing id's from separate MXML file

Question

I'm new to Flex (and fairly new to programming in general)
and have a question that Google hasn't helped with.
The relevant code is below, and here's the long and short of
it. There's a TextInput whose visibility I want to toggle via a
function in a separate AS file. On the line
"photoNameEditor.visible = false;" though, Flex Builder gives me an
"1120: Access of undefined property photoNameEditor" error, and the
same goes for photoName.
I'm fairly sure the problem is that the AS file doesn't
recognize the id from the separate MXML file. The error goes away
when I put the ActionScript between <mx:Script> tags in the
MXML file, but I'd much rather keep the AS in its own file. So my
question is what's the best way to get the AS file to recognize
id's from a separate MXML file?
Thanks very much. I'd appreciate anything you think might
help.

Answer 1

There are a couple things going on here. Let's assume you
want to stick with this approach where you're including external
scripts instead of importing a class or using event dispatches
(that will all come later - months if your experience is anything
like mine). Given that, I'm not sure that text is the best control
for what you want to do, but I'm not sure what you want to do
exactly. However, if you need text in your situation, might try a
label, linkbutton, button - things that play well assumed links and
clicks. However, given your code and if you want to use text
instead of a label, you can move the handler to the mouseDown
event, rather than click, and it would probably work. (sorry for
the formatting - lazy right now):
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Script source="scripts/toggleStyles.as" />
<mx:VBox x="55" y="45" height="100%">
<mx:Label id="photoName" fontSize="12" fontStyle="normal"
text="Click Me" enabled="true" fontWeight="bold"
click="togglePhotoNameEdit()"/>
<mx:TextInput id="photoNameEditor" fontSize="16"
width="300" />
</mx:VBox>
</mx:Application>
<!--and the ActionScript file:-->
// ActionScript file
private function togglePhotoNameEdit():void {
photoNameEditor.visible = !photoNameEditor.visible;
}