Page 1 of 1

HTML script integrate with RPG program

Posted: Wed Jun 19, 2013 11:44 am
by mrojek
I have a simple html file that I want to implement into my RPG program (attached). Basically the html file retrieves latitude and longitude coordinates. I am trying to get the latitude and longitude coordinates into text fields in the display program, but I am not sure how to do this. Is there anyway you can do this without using RPGsp, maybe just using javascript? Any information would be great.

Thanks

Re: HTML script integrate with RPG program

Posted: Wed Jun 19, 2013 12:09 pm
by David
Yes, you can use any JavaScript you'd like in RPGsp pages. JavaScript code is handled entirely by your web browser, and is not dependent on or affected by RPGsp in any way.

This means that you can use any 3rd party JavaScript code, components, tutorials, etc., and there are absolutely no special requirements for RPGsp. If your web browser supports the code, you can run it in an RPGsp page!

You can integrate this code using the following general steps, please see JavaScript references/tutorial for exact coding concepts and syntax:

1. You can place the 'getLocation()' function into a JavaScript file inside your http server document root directory.

2. You can place a <script> tag into the <head> section of your RPGsp page to link in the file.

3. Then you can call the 'getLocation()' function as needed.

4. JavaScript code can manipulate HTML elements on screen, for example this code will change the value in a text box:

Code: Select all


// Here we are referring to the "id" attribute on the <input tag...

document.getElementById("theId").value = "My new value";


Re: HTML script integrate with RPG program

Posted: Wed Jun 19, 2013 5:58 pm
by Scott Klement
You could certainly do this from a Profound UI Rich Display file (or converted DDS screen.) You don't need to use RPGsp.

What you'd do is put your JavaScript file in the /www/YOUR-INSTANCE/htdocs/profoundui/userdata/custom/js directory. (Or a similar location.) The Handler will automatically load code that's under userdata/custom/js.

Instead of using document.getElementById() and x.innerHTML, you'd want to use the changeElementValue() API to change the value of a text box. This would put the coordinates into a regular field on the display that would be read by your RPG program when the screen is submitted.

Does that help? Would you like me to put together a quick example program?

Re: HTML script integrate with RPG program

Posted: Thu Jun 20, 2013 4:57 pm
by David
Sorry, about that. For some reason I read your post as saying that you were or wanted to use RPGsp, but I see now that you had said the opposite. :-).

Re: HTML script integrate with RPG program

Posted: Mon Jun 24, 2013 7:13 am
by mrojek
Hey guys, thanks for responding to my question so fast!

Scott, can you do a quick example program? I am still having trouble getting the value of the text box to change for some reason.

Any information would be great.
Thanks

Re: HTML script integrate with RPG program

Posted: Mon Jun 24, 2013 6:28 pm
by Scott Klement
Okay, I decided rather than creating a separate JS file to just put the logic under the "onclick" of my button. So here's the screen I came up with:
6-24-2013 5-23-14 PM.png
6-24-2013 5-23-14 PM.png (53.75 KiB) Viewed 3318 times
The basic idea is that it will do a geolocation routine to find out where my browser is located, and when that completes, it will fill-in the textboxes named "txtLat" and "txtLon" (for latitude and longitude, respectively) with the values from the geolocation. The txtLat and txtLon widgets are bound to the Lat & Lon variables in the RPG program -- so when the results come back, I have it use pui.click() to submit control back to the RPG. I didn't really need to go back to the RPG in this example, but I thought it might be interesting, because it allows you to see how you'd get the data into the RPG program if you need it there.

This is what the "onclick" for the "TryIt" button looks like:

Code: Select all

if (navigator.geolocation) {
     navigator.geolocation.getCurrentPosition(function(pos) {
       changeElementValue("txtLat", pos.coords.latitude);
       changeElementValue("txtLon", pos.coords.longitude);
       pui.click("btnSubmit");
     });
}
else {
  alert("Geolocation is not supported by this browser.");
}
Then, just for kicks, I had the RPG build a URL to Google Maps to show that location in an iFrame widget, so you can see where those coordinates are on a map, as shown, above.

I've attached the PUI display file and the RPG code as attachments to this post so you can see how it all works.

Re: HTML script integrate with RPG program

Posted: Tue Jun 25, 2013 7:37 am
by mrojek
Scott,

Works great, thanks for all your help!

Re: HTML script integrate with RPG program

Posted: Mon Jan 06, 2014 5:12 pm
by jbarajas
Hello Scott,
Hope you had a wonderful Christmas Season.

I have a question for you....
My problem is, I need the Iframe-html to update a couple of fields to the Rich-display and then hit Enter.
(something like from your sample, when I click on the map, the lat/long is passed back to the Rich-display and hit submit)

Thanks
Jimmy Barajas
Scott Klement wrote:Okay, I decided rather than creating a separate JS file to just put the logic under the "onclick" of my button. So here's the screen I came up with:
6-24-2013 5-23-14 PM.png
The basic idea is that it will do a geolocation routine to find out where my browser is located, and when that completes, it will fill-in the textboxes named "txtLat" and "txtLon" (for latitude and longitude, respectively) with the values from the geolocation. The txtLat and txtLon widgets are bound to the Lat & Lon variables in the RPG program -- so when the results come back, I have it use pui.click() to submit control back to the RPG. I didn't really need to go back to the RPG in this example, but I thought it might be interesting, because it allows you to see how you'd get the data into the RPG program if you need it there.

This is what the "onclick" for the "TryIt" button looks like:

Code: Select all

if (navigator.geolocation) {
     navigator.geolocation.getCurrentPosition(function(pos) {
       changeElementValue("txtLat", pos.coords.latitude);
       changeElementValue("txtLon", pos.coords.longitude);
       pui.click("btnSubmit");
     });
}
else {
  alert("Geolocation is not supported by this browser.");
}
Then, just for kicks, I had the RPG build a URL to Google Maps to show that location in an iFrame widget, so you can see where those coordinates are on a map, as shown, above.

I've attached the PUI display file and the RPG code as attachments to this post so you can see how it all works.

Re: HTML script integrate with RPG program

Posted: Mon Jan 06, 2014 5:47 pm
by Scott Klement
Hey there Jimmy,

If you have JavaScript running in an iframe, it can access the parent document by prefixing it's DOM calls with 'parent'. In my example in this thread, of course, the JavaScript is running in the parent already, so there was no need to do that. But... it should work from the child by adding the 'parent' prefix.

Does that answer your question? I'm not familiar with your "iframe html", so I'm hoping I'm answering it right :-)