Posts by DecSoft

Hello John,

That's quite rare... please, try with a new app... and place a "console.log" in the app's Show event... and look in the console... I can see it here, so, you also must see it... The only thing in which I can think is that the browser don't show the console messages for some reason... (?)

P.S. Try the new app in various browsers like Chrome (I think you use this) but also in Firefox or Edge, for example.

Hello John,

That's quite rare... are you talking about a "normal" app or a WebExtension app? In the first case, you must see that message (I can see it here using an app's view Show event)... in the second case, maybe you are looking at the console of the WebExtension, but, the message must appear in the app's console: if I am not wrong that consoles are differents, due to the different contexts.

Hello Jhonson,

Maybe there is a way, but, honestly I can't find it. Of course the code that you shows don't work as you expected. I think that we need a template to be prepared in order to properly work. I made some tests and here is what I can suggest. First of all, place the below Javascript code in the app's Mounted event:

As you can see, we can define one or more "inputs", including their properties, types and even a possible "label" to be used for every input. Additionally, we define an app variable which will store the inputs models / values. Now, place the below HTML markup (VueJS template) inside an HTML control:

When you run the app you can see the two defined inputs along with all the properties and even the labels, properly referred for every input. You can even place the above template inside an HTML control, and, don't define the "myInputs" and "myInputsModels" variables in the app's Mounted event: you can also do in a button's Click event, for example, and, also works as expected: the point is that you can't see nothing in the HTML, except when the variables are properly defined.

On the other hand, you specifically ask how to create "reactive element at runtime", but, I honestly can't see the point for these elements to be "reactives". I mean, it's perfectly possible to create elements at runtime, handle their events, get their values, etc., etc., just like I already shows in this specific thread's post. If you ask me "what you will do", David, I will answer that, of course, depend on the app's needs, but, what I mean is that it's perfectly possible to create controls at runtime, not "reactives", but, perfectly usables and with all the expected characteristics and behaviour.

The only point that may you must take in consideration is the where to add the controls. In your above code, you add controls directly to the HTML document's body: this is not correct, to say like that, since you can / must use an HTML control, and, inside that control, place any control that you need at designtime or at runtime, depends on your needs. I do this in various apps, for example, to add inputs by user demand (supose an app's view which allows the user to add one or more input files to be uploaded) and it's perfectly possible.

Another thing to take in consideration can be the way in which you can add elements at runtime: since we have the jQuery library in our apps, ready to be used, I think there is no point to don't take the jQuery library advantages. So, suposing I want to add inputs at runtime when a user click a button, I will do in a way similar than the below one:

Please, don't hesitate to post here if you have any further questions around this thread's topic.

Hello Jhonson,

Yes; Place the below in the HTML control:

And the below in the app's view Show event or the app's Mounted event:

Take a look at the app's store property. Take a look also at the "Html" sample app included with the AB installation.

P.S. Please, Jhonson, use different forum's threads for different questions / topics, so we keep the forum better organized.

Hello to all,

Here is a new DecSoft HTML Compiler with the below changes, fixes and enhancements:

Read the entire product's history

Hello to all,

Here is a new DecSoft App Builder with the below changes, fixes and enhancements:

Read the entire product's history

Hello Johnson,

We must use the right HTML markup for every Bootstrap CSS control / component that we want to use. I already prepares a Grid sample app to be included in the next release of AB, however, in fact it's easy to explain how to proceed.

1º Place the below HTML markup inside an AB HTML control:

2º In the app's view in which you place the HTML control, place the below Javascript code in the app's view Show event:

So as you can see we use the Bootstrap CSS Grid system, place some inputs and some buttons, and, also the right handlers to react when the buttons are pressed by the user. In the same way that we add these inputs and buttons we can add any other Bootstrap CSS component and deal with it.

Again, the autoscale option of AB can be enough, in other words, not all the apps requires to use the referred HTML markup, the Bootstrap CSS Grid system, etc., but, if we wanted, we can do it, thanks to the HTML control of AB. Of course you must refer to the Bootstrap CSS framework documentation in order to properly use his components, CSS classes, etc.

Hello to all,

Here is a new DecSoft App Builder release, with the below changes, fixes and enhancements:

Read the entire product's history

Hello Jhonson,

Yes; certainly AB offers the ability to make the apps "autoscale": you can read more here in this help topic. Basically we can use a fixed style or a scaled style (we can changes between them even at runtime), and, combine this last one with the MaxWidth and MaxHeight app's properties.

On the other hand, AB apps uses the Bootstrap CSS framework, so, if we want to go beyond the autoscale option of AB, we can use the Bootstrap CSS grid system also. For example, here is some HTML markup that you can place inside an HTML control of AB (you can copy the below code and just paste it inside an app's view: then an HTML control with that HTML markup are automatically created):

In many apps (or app's views) the autoscale option can be enough, but, certainly there is no problem to use an HTML control (which can cover partially or all the app's view) to use the Bootstrap CSS grid system, that is, the appropriate HTML markup, like the above sample. And it's also possible to use the AB HTML control to place virtually any HTML markup (with the Bootstrap CSS power), including inputs, buttons, etc.

Hello John,

Thanks for fixing this issue, for all of the support you provide and for App Builder.

Always thank you for your trust, sir, and, also for your kindly words. ;-)

Hello John,

You are right. There is a bug for these kind of paths which has been solved in this new release of DecSoft App Builder.

Hello to all,

Here is a new DecSoft App Builder with the below changes, fixes and enhancements:

Read the entire product's history

Hello John,

I think the "add folder" option can be good for your purpose. Just look at the "LeafletMaps" sample app. It's not only a question of organize the files inside the compiled folder (not too important, I think...) but also considering the app's files itself... that's what you can see in the "LeafletMaps" sample app: we have a "resources" folder, which contains all what we need.

So, if you create a folder like "resources", and, inside that folders, you put the "models", "views" and "controllers" folders, and you add the "resources" folder with the "add folder" tab of the Files manager, then you get what you wanted. Or maybe you can add the "models", "views" and "controllers" folder separetelly, so that folders becomes in the "files" folder of the compiled app.

I think that can be enough... maybe not exactly as you wanted, because the added folders becomes to the "files" folder of the compiled app, and not to a "script" folder, but... I think can be enough. If you really wanted the "script" folder... you can include the "models", "views" and "controllers" folders inside a "script" folder... so certainly that folder becomes in the "files" folder of the compiled app.

Again, maybe not exactly like you wanted, but I honestly think that can be enough.

Hello John,

I think that can imagine what you wanted, but, I am not completely sure about... that is... to me the files are well organized, since scripts come to the scripts folder, styles to the styles folder, other files come to the files folder, and, even entire folders (that we can add) come to a files / folder "as is"...

Maybe you need something like this last "add folder" option? Please, take a look at the "LeafletMaps" sample app. Note that what we do there is to add an entire folder (with all the files required by the library, including images, scripts, styles, etc.) and then we use the Scripts tab of the Files manager to refer to that files (inside the folder).

So, firstly, I think that AB organize well the scripts, styles, other files, etc., but, the "add folder" option give us the ability to organize (if we wanted) the files in another way too. This option is mainly designed to make easy the usage of entire Javascript libraries, but, may can also be good if you want to organize the files in other way than AB do by default.

Hello Mario,

I hope this new release of DecSoft App Builder can be useful to you.