Reading a json file from a URL then show content on screen

Develop and Deploy Cross-Browser Web Apps .
Post Reply
cgetty
Posts: 17
Joined: Mon May 19, 2014 5:54 am
Location: Texas, Somerset
Contact:

Reading a json file from a URL then show content on screen

Post by cgetty »

Date 3.24.23 CrossUI Builder 2.5, Windows 10

Using the action editor I set up two actions.
1) read a json from a URL <-- this dose not seem to work for me. needed to read a text file from a URL update 3.25.23

2) Show the data that was read into a ui_element html property [HTML] <-- seem to work for me needed to read a text file from a URL update 3.25.23

It worked a couple of times (showing the the json file that was read from the URL into a ui_element html property [HTML] ) then stopped working. <-- I may have have been confused because I was using read json from URL. Which dose not work for me. But I Think it should. 3.25.23

This is the URL that was read http://elmoross.atwebpages.com/f_up/upload/data.json

Date 3.25.23 I updated the source code below. I also deployed it here:
http://elmoross.atwebpages.com/sb/. I deployed it from my windows 10 computer. It works but it takes a very long time to load.

I also tried running on line at your site https://www.crossui.com/RAD/ and here https://www.crossui.com/RAD/Builder.html nether worked when I ran debug mode.

Clark

Code: Select all

// The default code is a module class (inherited from xui.Module)
// Ensure that all the value of "key/value pair" does not refer to external variables
xui.Class('App', 'xui.Module',{
    Instance:{
        // Dependency classes
        Dependencies:[],
        // Required modules
        Required:[],

        // To initialize properties
        properties : {},

        // To initialize instance(e.g. properties)
        initialize : function(){
        },

        // To initialize internal components (mostly UI controls)
        // *** If you're not a skilled, dont modify this function manually ***
        iniComponents : function(){
            // [[Code created by CrossUI RAD Studio
            var host=this, children=[], append=function(child){children.push(child.get(0));};
            
            append(
                xui.create("xui.UI.Button")
                .setHost(host,"xui_ui_button1")
                .setLeft("1.5238095238095237em")
                .setTop("0.7619047619047619em")
                .setWidth("29.63809523809524em")
                .setCaption("Read from a URL then show the data in the ui_element")
                .onClick([
                    {
                        "desc" : "wait message",
                        "type" : "other",
                        "target" : "msg",
                        "args" : [
                            "please wait",
                            "Data being read from internet",
                            200,
                            5000
                        ],
                        "method" : "message",
                        "event" : 1
                    },
                    {
                        "desc" : "Read online file",
                        "type" : "other",
                        "target" : "url",
                        "args" : [
                            "http://elmoross.atwebpages.com/f_up/upload/data.json"
                        ],
                        "method" : "readText",
                        "okFlag" : "_DI_succeed",
                        "koFlag" : "_DI_fail",
                        "event" : 1,
                        "onOK" : 1,
                        "onKO" : 2
                    },
                    {
                        "desc" : "put data into field",
                        "type" : "control",
                        "target" : "okdata",
                        "args" : [
                            {
                            },
                            {
                                "html" : "{temp.okData}"
                            }
                        ],
                        "method" : "setProperties"
                    }
                ])
            );
            
            append(
                xui.create("xui.UI.Element")
                .setHost(host,"okdata")
                .setLeft("0.5em")
                .setTop("2em")
                .setWidth("32.7em")
                .setHeight("13.55em")
                .setHtml("\n\n\n<title> </title>\n<span style=\"color: rgb(0, 0, 0); font-family: arial, helvetica, clean, sans-serif; font-size: 12px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;\">\n\n\n\n<p><big>Date 3.24.23</big></p>\n\n<p><big>Using the action editor I set up two actions. </big></p>\n<div style=\"margin: 0px; padding: 0px; overflow-wrap: break-word; color: rgb(0, 0, 0); font-family: arial, helvetica, clean, sans-serif; font-size: 12px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;\">\n\n<p><big>1) read a text file from a URL </big></p>\n\n<p><big>2) Show the data that was read into a ui_element html property [HTML] </big></p>\n\n<p><big>It worked a couple of times (showing the the json file that was read from the URL\ninto a ui_element html property [HTML] ) then stopped working.&nbsp; </big></p>\n\n<p><big>This is the URL that was read:&nbsp; <a href=\"http://elmoross.atwebpages.com/f_up/upload/data.json\" target=\"_blank\">http://elmoross.atwebpages.com/f_up/upload/data.json\n</a></big></p>\n\n<p><big>Update 3.25.23 this part seems to be working now. </big></p>\n\n<p><big>For more info see this link on the CrossUI forum&nbsp; <a href=\"https://www.crossui.com/Forum/viewtopic.php?f=4&amp;t=372&amp;p=1059#p1059\" target=\"_blank\">https://www.crossui.com/Forum/viewtopic.php?f=4&amp;t=372&amp;p=1059#p1059\n</a></big></p>\n</div></span>\n\n\n")
                .setCustomStyle({
                    "KEY" : {
                        "color" : "#0000FF",
                        "font-size" : "20px",
                        "font-weight" : "bold"
                    }
                })
            );
            
            return children;
            // ]]Code created by CrossUI RAD Studio
        },

        // Give a chance to determine which UI controls will be appended to parent container
        customAppend : function(parent, subId, left, top){
            // "return false" will cause all the internal UI controls will be added to the parent panel
            return false;
        },
        /**
         * Fired when user click it
         * @method onClick [xui.UI.Button event]
         * @param {xui.UIProfile.} profile  The current control's profile object
         * @param {Event} e , Dom event object
         * @param {Element.xui} src  id or Dom Element
         * @param {} value  Object
        */
        _xui_ui_button47_onclick:function(profile, e, src, value){
            var ns = this, uictrl = profile.boxing();
        },
        /**
         * When the timer is triggered regularly. If returns [false], the timer will end
         * @method onTime [xui.Timer event]
         * @param {xui} profile .Profile
         * @param {} threadId  String
        */
        _xui_timer1_ontime:function(profile, threadId){
            var ns = this, uictrl = profile.boxing();
        },
        /**
         * When the timer start to run
         * @method onStart [xui.Timer event]
         * @param {xui} profile .Profile
         * @param {} threadId  String
        */
        _xui_timer1_onstart:function(profile, threadId){
            var ns = this, uictrl = profile.boxing();
        }
        /*,
        // To determine how properties affects this module
        propSetAction : function(prop){
        },
        // To set all node's style in this modlue
        customStyle:{}
    },
    //To customize the default properties and event handlers
    Static:{
        $DataModel:{
        },
        $EventHandlers:{
        }
    */
    }
});

Post Reply