Can javascript debug in OutSystems?

Can javascript debug in OutSystems?

  

Hi, 

I'm trying to try the following Javascript code:

function notify(){
    var x = document.getElementByClassName("campana");
   
    alert(x.getAttribute("src"));
   
    if($parameters.numAvisos === 0){
        x.setAttribute("src", "/EverinsApp/img/XX.campana0.png");
    }else if($parameters.numAvisos === 1){
        x.setAttribute("src", "/EverinsApp/img/XX.campana1.png");
    }else if($parameters.numAvisos === 2){
        x.setAttribute("src", "/EverinsApp/img/XX.campana2.png");
    }else if($parameters.numAvisos === 3){
        x.setAttribute("src", "/EverinsApp/img/XX.campana3.png");
    }
   
    alert(x.getAttribute("src"));
}

First, the Javascript code is at the beginning of an OnInitialize function of a screen in my app. I want this code to check a variable, and according to the value of it, show one image or another. The question is that I do not change the image, and when I put the alert () to see the current value I do not see anything, is there any way to debug? Can someone help me with this?

Thanks,

Jordi.

Hi,


Not very experienced with debugging mobile, but I assume alerts will not work.

I think you are better off with console.log.

perhaps with a cordova-plugin as well


J. wrote:

Hi,


Not very experienced with debugging mobile, but I assume alerts will not work.

I think you are better off with console.log.

perhaps with a cordova-plugin as well


Hi,

I attach another image in case it is clearer what I want to explain. I have inserted an image, to which I have put an attribute "class" called "bell". Then in Javascript I try to recover that element with the getElementsByClassName () method, but apparently it does not recover that object. Can anyone help me?

Thanks, 

Jordi.


Hi Jordy,

Are you executing this javascript in a javascript node? If so, you have the ability to create output parameters, including objects, which can be assigned in an assign node after the javascript node executes. You can use this to store whatever values you are trying to access in a local variable, and either view the data via debugger, or show it on your screen.

Here is an example of a javascript variable being passed to an output parameter:

Let me know if this helps,

Justin

Solution

 @Jordi

Don't know for sure what you're trying to do, but l would use a Block to display the images.

Blocks can be reused in screens.


It would receive an input parameter with the number of warnings.



Then you can decide based on the input what image to display.


Solution

@Jordi

You can even have different events for different images and have those events being treated differently.

You could add an Image1Event to image 1 that is triggered when you click on that image.

Notice the Image1OnClick client action.

Then in the parent screen you can say what numAvisos (your variable) to pass and choose a an event handler.


 

Hi Jordi

The answers are very helpful for solving your particular problem. However, if you still need to debug the JS there are a couple of options. As @J. suggested, console logging is quite helpful. To log in a message to the console you can use the native javascript "console.log('message')" or you can use the Common Plugin's ConsoleLog action. If you want to see the javascript code executing, and are using and Android device on windows computer (not sure if it works on Mac) follow this steps:

  1. If you have not activated USB Debugging on your device, do so.
  2. Fire Up Chrome
  3. Connect you Android device with the app installed (not on Outsystems Now) on it
  4. Fire up the app
  5. Open Chrome Developer Tools (Control+ Shift + i)
  6. Go to the Remote Devices Tab (if you do not see the tab you can access it from the 3 dot menu at the upper right corner)
  7. If there is a prompt on the device to trust the computer accept it
  8. Click on the device. There will be a list of the open webviews, your app should appear there. Click on the inspect button. A window will open with the app's screen and in the Console Tab you can check out the debugging messages you have written.
  9. A way more complete guide of doing this has been written by the Outsystems Team. You can find it over here.

On iOS, as far as I know, the only way to check out the console is using the Console Log Plugin, though if anyone knows of a better way to do this, I'dlove to hear it.

Hope this helps!


Regards,

  Carlos Lopez S. Jacome

João Heleno wrote:

 @Jordi

Don't know for sure what you're trying to do, but l would use a Block to display the images.

Blocks can be reused in screens.


It would receive an input parameter with the number of warnings.



Then you can decide based on the input what image to display.


Hi Joao,

Thanks for the solution, this is that I'm searching.

Regards,

Jordi.