How can I link to another form in the same app using HTML?

1

I’m building an app with MANY Forms. I’d like to provide the user the ability to go to other Forms WITHOUT using Buttons (or other NSB controls with similar functionality, e.g. Label).

Note that each Form contains lots of HTML code… I’d love to be able to have the links buried in that HTML code… I tried but it didn’t work…it didn’t even show up on the HTML page. Any suggestions would be appreciated

I have another solution but it’s a kluge from the user’s perspective and I would prefer an HTML solution.

2

AppStudio has a ChangeForm() function which takes care of all the housekeeping associated with changing forms. This is what normally would be called.

What are you thinking would trigger a change to a new form?

3

The app, in essence, is a book consisting of pages… each page is a form… The content of each form consists of a set of buttons at the top of the page (such as go to previous page, go to next page, etc.) and a single large Label(BS) Control which contains all of the text of the page in form of an HTML “Detail” control.

The trigger I’m looking for is one or more links within the page (i.e., within the “Details”) that would take the user to another form, as you would have if working in a pure HTML environment.

One work-around is to add the ‘buttons’ linking to other related pages at the bottom of the form, AFTER the “Detail”… the issue is that as the HTML “Detail” control is expanded (it opens down), it expands UNDER any other controls that are on the form. Unless there is a way to force which ‘layer’ a control is at… i.e., that the Detail control, as it expands, will be OVER (on top of) the other controls (such as a button), this work-around is not viable.

Another work-around would consist of adding another ‘button’ at the top of every page which would take the user to another form which contains all the links (in the form of ‘buttons’ with an event of Change Form(). So the user, if s/he wants to view the other page, would have to tap the new ‘button’ on top of the form (to get to the list of ‘other’ pages) and then tap on the desired page title…. Not as elegant as tapping on the desired page title link directly.

Tom C.

4

You wrote:

The trigger I’m looking for is one or more links within the page (i.e., within the “Details”) that would take the user to another form, as you would have if working in a pure HTML environment.

I use the htmlView control and put something like the following into the innerHTML so the user can select it and the app will then execute the function (in this example hCategory) and do something.

<a href=javascript:hCategory();+Categories-/a>

Function hcategory()
  'load another page here 
End Function

The BS label accepts html code and this should work there as well. But be careful with coding html into this control. I’ve had issues with entering bad code that was hard to trace. the htmlView control seems to be more forgiving.

John

5

Oops, just tried putting html into the BS label control and it’s a no go. Sorry about that. But if you do have a control that takes html the procedure I mentioned should still work.

John

1 Like
6

That’s interesting… I’m using a Label(BS) and use the <Details> tag within in and it works perfectly.

BTW, I’m using Basic in this app, not Javascript… not sure if that has an impact on my proposed code below.

Here’s my first (ever) attempt to use htmlView;

Let’s say the text in a <p> within a <Details> entry is “See Prototype for help” and I want the user to be able to click the word Prototype and jump immediately to a form called Prototype.

I assume that I replace the word “Prototype” with the following:

htmlView.innerHTML=<a href=javascript:FuJump23();>Prototype</a>

And in the code for the ‘sending’ form, I have the following:

Function FuJump23()
   ChangeForm(Prototype)
End Function

John, thanks for the help!

Tom

1 Like
7

Hmmm… that post didn’t work very well… Trying again…

Here’s my first (ever) attempt to use htmlView;

Let’s say the text in a<p> within a <Details> has the following phrase “See Prototype for help”.
and I want the user to be able to click the word Prototype and jump immediately to a form called Prototype.

I assume that I replace the word "Prototype" with the following:
htmlView.innerHTML=<a href=JavaScript:FuJump23();>Prototype</a>

And in the code for the 'sending' form, I have the following:
Function FuJump23() 
  ChangeForm(Prototype)
End Function

That’s better

8

Pretty sure I’ve also used html in a BS label. Must have just done something wrong.

John

9

Here’s a tip which helps when posting code and HTML to the board:

If you’re submitting a reply by email, surround the text with left tick ( ` ) characters and it will format properly.

It’s actually nicer to add complex messages using the web interface, which lets you see the formatted message as you are typing.

10

Thanks, works great.

<a href=javascript:hCategory();>Categories</a>

John

11 
This almost works perfectly...

The code I used was:
htmlView.innerHTML=<a href=JavaScript:FuJump1();>Template</a> ... which I used to replace the word "Template" in the <Details>.

However, what shows when running the app on Chrome on the PC is this:

"See htmlView.innerHTML=Template for more information."

When I click on "Template", I jump to the form I want (Oh Joy!!!)... BUT, how do I get rid of the "htmlView.innerHTML=" from showing in the executed app?

Tom

1 Like
12

I just made a new app with an HTMLView1 object and a button (BS). The button code is:

Function Button1_onclick()
  HTMLview1.innerHTML = "`<a href=JavaScript:FuJump1();>Template</a>`"
End Function

No problem, just the link in blue with Template appears in the control.

Try just this very simple example first. Then take a look at what follows with the “…” maybe there is something there causing the problem.

John

1 Like
13

Hi John…

After I did all the stuff below, I added a Button to the app and then your Function Button1_onclick()… I got an error message saying that “Uncaught ReferenceError: HTMLview1 is not defined.” Since that message never came up when I was doing all the things below, I’m confused… I don’t know what’s going on, although that’s secondary to the real issue which is: how do I get rid of the “htmlView1.innerHTML=” when the app is run?

I duplicated your code exactly as below… I had HTMLview.innerHTML… and you had HTMLview1.innerHTML… This had no impact.

You had double quotes (“) before <a and after >/a which I did not have… This had no impact.

I dropped the stuff after the … as you suggested, so that the code looks like the following:

(Rest of the code in the <Details> tag…

<p>For more information, see htmlView1.innerHTML="<a href=JavaScript:FuJump1();>Template</a>"

</details>

And the result showing during execution is:

For more information, see htmlView1.innerHTML=" <javascript:FuJump1();> Template"

Note the “ “ surrounding Template, which were not there in early tests… I assume this is due to the quotes surround the <a…/a>

Hmmm, I moved the left quote from before <a to before htmlView1. And that resulted in:

For more information, see "htmlView1.innerHTML= <javascript:FuJump1();> Template"

Note how left hand quote moved.

Hmmm#2, I moved the left quote to left side of Template, and that resulted in:

For more information, see htmlView1.innerHTML= <javascript:FuJump1();> "Template"

Went back to way you had set up the quotes, then ran it on iPad (Safari) ( And Chrome on PC) with same results… the “htmlView1.innerHTML=” always shows.

14

I cleaned up your message, adding left ticks around the code. It now appears properly in the Web Interface.

1 Like