Append text to a box onclick

rp-7
#1

Hello,

I’m new to Axure, and I have a question about appending text to a box.

I’m prototyping a “netchat” type system, where a user can type their message in a box, press the “post” button, and it will appear in the general chat box above.

I have it working where typing a new message and pressing ‘post’ changes the text in box above, but when I type another message in it replaces the original text. I want it to add the new text, on a new line to the general chat box.

At the moment the actions on the post button are:

“Set text on ChatDialogue equal to text on NewChatMessage” - adds typed line to chat box
“Set text on NewChatMessage equal to”" " - removes text from message box
“Set Focus on NewChatmessage” - sets focus

I really want a function like:
“Append text on ChatDialogue equal to text on NewChatMessage”"

Any ideas how this can be achieved?
Thanks.

Change font / have different fonts when using "Insert Variable or Function"
#2

This sure can be achieved, and it’s not too difficult either.

Let say you have three widgets: TextArea, TextField, and Submit.

TextArea is where you want to display the chat text. TextField is a text field where you can enter text. Submit is a button.

On Submit’s OnClick action create a case with an action to Set Text on TextArea. Now, click the fx button in the case editor and input this:

[[Target.text]]
[[LVAR1]]

In the Local Variables section in the lower half of the Edit Text window add a local variable and make it equal to text on widget TextField.

Now anytime you click the button it will set the text on TextArea equal to what it was before, plus whatever was in TextField. You can of course format this any way you like. Hope this helps!

#3

Hi nkrisc,

Thanks for getting back to me.

I can see what you’re suggesting doing and have implemented this successfully. However, there are a few problems with it:

  • When you press the button for the first time, you see “undefined” at the top of the chat window, then the message underneath
  • I want to clear TextField on submit, so the next message can be added, so I’m doing this: “Set text on NewChatMessage equal to”" " - removes text from message box. However this means the old message isn’t added, only the most recent message.
  • I want the new message to appear on a new line, can you tell me how to format it?

Again, many thanks!

closed #4
unlisted #5