#1 2015-08-28 20:52:21

pfisterhamj
Member
Registered: 2015-08-28
Posts: 10

Problem with setting variables from JavaScript Callback

Hello,

I'm trying to get the barcode from a javascript function (cordova plugin). Reading the barcode works. But I'm not able to set a global variable to get it into appbuilder.

if(App.Cordova) {
  alert('This function only works in Android, Windows Phone and iOS.');
  return;
}

var barcode = 'HELLO';

var scanresult = function(result)
{
     alert('We got a barcode\n' +
                'Result: ' + result.text + '\n' +
                'Format: ' + result.format + '\n' +
                'Cancelled: ' + result.cancelled);

     barcode = result.text;
}

var scanerror = function(result)
{
     alert('Scanning failed: ' + error);
}

cordova.plugins.barcodeScanner.scan(scanresult,scanerror);

window.App.RootScope.Barcode = barcode;

I get the results from barcode scanning. But my Variable [Barcode] in appbuilder has the value 'HELLO'.

I'm not really a javascript guy. But I think I should exist a workaround.

Hope someone can help me.


Thanks

Offline

#2 2015-08-28 21:30:35

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,661
Website

Re: Problem with setting variables from JavaScript Callback

Hello Jürgen,

The problem here is that "scanresult" function is executed asynchronously, then what we assign to "window.App.RootScope.Barcode" is the first defined "barcode" variable value, that is, "HELLO".

Once "scanresult" is executed, what you do is to assign the "result.text" to the "barcode" variable, not to "window.App.RootScope.Barcode". Then the solution is to assign the "result.text" to this variable:

var scanresult = function(result)
{
     alert('We got a barcode\n' +
                'Result: ' + result.text + '\n' +
                'Format: ' + result.format + '\n' +
                'Cancelled: ' + result.cancelled);

     window.App.RootScope.Barcode = result.text;
}

Offline

#3 2015-08-28 21:40:59

pfisterhamj
Member
Registered: 2015-08-28
Posts: 10

Re: Problem with setting variables from JavaScript Callback

Hello David,

thanks for the quick reply.

if(App.Cordova) {
  alert('This function only works in Android, Windows Phone and iOS.');
  return;
}

var scanresult = function(result)
{
     alert('We got a barcode\n' +
                'Result: ' + result.text + '\n' +
                'Format: ' + result.format + '\n' +
                'Cancelled: ' + result.cancelled);


          window.App.RootScope.Barcode = result.text;
}

var scanerror = function(result)
{
     alert('Scanning failed: ' + error);
}

cordova.plugins.barcodeScanner.scan(scanresult,scanerror);

I have a simple code for the button:

ScanBarcode
AlertBox "[Barcode]" "primary"

But the Variable [Barcode] remains undefined in the alert.

Best regards

Offline

#4 2015-08-28 22:16:04

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,661
Website

Re: Problem with setting variables from JavaScript Callback

Hello Jürgen,

Certainly the problem is that "scanresult" function is executed asynchronously. If I am not wrong "ScanBarcode" is an app function which is called in order to retrieve a barcode. however, such function launch the Barcode "picker" (correct?), and, until the user really scan the barcode the, the "scanresult" nor "scanerror" are executed.

Then we can't use the variable "Barcode" just after call the "ScanBarcode" app function, because such variable is not available at all until the user scan the barcode. What is solution? The solution is to react when the "scanresult" function are executed. My suggestion is to prepare an app function, say "BarcodeReaded", and write something like this in the "scanresult" function:

var scanresult = function(result)
{
  // ...
  window.App.RootScope.Barcode = result.text;
  window.App.RootScope.BarcodeReaded();
}

We can also add a "Text" argument to the "BarcodeReaded" function, then we can simply write something like this:

var scanresult = function(result)
{
  // ...
  window.App.RootScope.BarcodeReaded(result.text);
}

This is the way in which this kind of things works, not only for the barcode plugin. For example, the we can't write something like that using an Http client control:

HttpExecute "HttpClient1"
AlertBox "[HttpClient1.Response]" "info"

The above "AlertBox" can't show the Http client response, because they are not available until the Http client Success event is executed. If in the future I implement the Barcode plugin in App Builder, they must have an "Success" and "Error" events too, in order to be ready when the user scan a barcode.

Hope you can understand this Jürgen, when not, don't hesitate to continue posting.

** Please carefully read the next post **

Offline

#5 2015-08-28 22:20:22

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,661
Website

Re: Problem with setting variables from JavaScript Callback

Hello Jürgen,

My latest post solution must works like expected, however, I forget than "window.App.RootScope" variable dot not give us access to app functions, which made the solution unuseful.

I made the appropiate changes right now in order to allow us to get access to app variables and app functions too. However, note that I rename "window.App.RootScope" to "window.App.Scope" to maintain some internal coherence.

You need to update your App Builder copy to get this changes ready! www.getappbuilder.com

And remember:

1º Call an app function when the barcode is ready:

var scanresult = function(result)
{
  // ...
  window.App.Scope.Barcode = result.text;
  window.App.Scope.BarcodeReaded();
}

Or:

var scanresult = function(result)
{
  // ...
  window.App.Scope.BarcodeReaded(result.text);
}

If you need more help please tell me. If you finally got it please tell me too.

Offline

#6 2015-08-28 22:38:37

pfisterhamj
Member
Registered: 2015-08-28
Posts: 10

Re: Problem with setting variables from JavaScript Callback

Hello David,

the solution with:

window.App.Scope.BarcodeReaded(result.text);

is really cool. Works really great.


Thanks for helping me.


Best regards
Jürgen

Offline

#7 2015-08-28 22:39:20

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,661
Website

Re: Problem with setting variables from JavaScript Callback

Hello again,

Please, update (if you like) your App Builder copy: I add the new External app sample, which show us how we can set an app variable and call an app function from external app Javascript code: www.getappbuilder.com

Offline

#8 2015-08-28 22:41:11

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,661
Website

Re: Problem with setting variables from JavaScript Callback

Hello Jürgen,

Always thanks you and thanks to tell me you finally got it!

pfisterhamj wrote:

Hello David,

the solution with:

window.App.Scope.BarcodeReaded(result.text);

is really cool. Works really great.


Thanks for helping me.


Best regards
Jürgen

Offline

#9 2015-08-29 00:05:16

pfisterhamj
Member
Registered: 2015-08-28
Posts: 10

Re: Problem with setting variables from JavaScript Callback

Hello David,

setting the barcode (that was scanned with camera) is only filled in a control if I touch onto the view. Then the value is updated.

Do I have to execute something after returning from camera?

Thanks for you patience

Best regards
Jürgen

Offline

#10 2015-08-29 00:25:12

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,661
Website

Re: Problem with setting variables from JavaScript Callback

Hello Jürgen,

Don't worry at all. Yes; in these scenarios we can use the ApplyModel action, in order to tell the GUI that some of our model variables changes. Use this action in your "BarcodeReaded" app function, after you set the "barcode result" variable.

Offline

#11 2015-08-29 08:26:57

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,661
Website

Re: Problem with setting variables from JavaScript Callback

Hello again,

Just to say that the current available release of App Builder have a new Barcode control (based in the same Adobe Phonegap plugin you use), a new BarcodeScan action and a new Barcode app sample. Take a look if you like Jürgen and hope everyone found this new control useful! www.getappbuilder.com

Offline

Board footer

Powered by FluxBB


Copyright ©2018 DecSoft. All rights reserved.