How to use the Full Calendar Schedule?

@Teodor, @George Is there a way in Wappler (SC or AC) to achieve what Jon has suggested?

I’m looking around now, but really just trial and error seeing if i can get it to work. Essentially returning a JSON file that has just the array of data from a SC query, WITHOUT the query name and {} at the begining of the file.

You may be looking for dmx.parse()

I’m pretty certain that if you put a server connect path in the brackets within an apostrophe at either end you will get a JSON output.

@Philip_J try please
dmx.parse('serverconnect.load({})')

Ok I will try that. I did think it was only for parsing an app connect variable but maybe it will work for this too. :crossed_fingers:

Thanks for the suggestions

Thanks again @s.alpaslan and @tesla for the suggestions. Unfortunately i have not been able to get this to work. I also went back to some of the old FullCalendar posts BEFORE it was implemented and found similar suggestions on using dmx.parse.

This is what i have got in the JS file (i’ve also tried as a script in the HTML head):

I also tried this:

I’ve tried a number of other combinations, and have also tried this on a vary plain HTML page with no other app connect components loaded except the bare minimum to get the FC Calendar to display.

Does anyone have any other insights as to why this isn’t working?

I have not been able to figure out how to write the JS code that @JonL suggested yet…

Cheers,
Phil

dmx.parse('serverconnect.load({parametername : value })')

wow… you work odd hours over there in Turkey :slight_smile: Thanks @s.alpaslan I’ll try and get that working

The only time I used dmx.parse i put the values into a variable, then used that variable in my JS function.
Eg
var eventValues = dmx.parse(‘SC_events.data.query1’)

JonL suggested using .select after the parse of the json values so this is what I would try…

events: eventValues.select

A quick follow up.
Here is Patrick talking about dmx.parse…

In that thread he mentioned that you have to wait for the server connect to load it’s data first before you can parse it in JS. The way he mentioned (that I followed) was to invoke the JS function with an ondone=“myfunction()” in the server connect action.

Thanks @tesla but unfortunately i still can’t get the damn thing to load… Bangin my head against a wall here the last couple of days lol.

I’ve tried the onload command and it works in that I can see that it loads a var from a script (a simple alert with some text) but its still not working in loading the events or resources for Full Calendar.

I think the issue lies deeper.

If i simply try to set a variable in app connect to display the results of the query (before using dmx.parse, so i can see what is happening)

I set the the AC variable to:

And the result is:

So if i use dmx.parse on that same variable in a JS script, using a simple ‘Alert’ function to see the results, that what i see. And if that is what FullCalendar is seeing as the events then no wonder its not working.

If i drill further down the query and select the two fields (id and title) this is what it looks like:


image

Now firstly, that is only the first result (I figure that is what the [0] is) but that is also not what the JSON array needs to look like:

[
{“id”:1,“title”:
“John Jones”}
]

What am i doing wrong?? Any more help much appreciated…

What do you get if you

console.log(dmx.parse(‘var1.value’)) ?

Interestingly i get this:

image

which is much more promising in terms of what I’m looking for.

An array of JSONs.

I believe that is actually what you need as per your first post.

So you need to plug into the scheduler the results of:

dmx.parse(‘SC_timeline.data.selectQuery.value’)

Make sure the data from the SC is available to AC when doing it. For that you need to follow @s.alpaslan indications or load them in a var first as @tesla mentioned.

Sorry @JonL i gave you the wrong info.

That previous screen shot is the result of:

and further expanded looks like:

If i do:
image
Where var.value is currently returning:

I simply get null in the console log

Does that change your response?

Either way i will try as you suggested

Indeed. You can ignore my reply then :slight_smile:

In your first screen try changing your console.log(myVar); line for these two.

var o = myVar.map( s => Object.values(s)[0] );
console.log(o);

A word of advice: I am very bad at giving js instructions from memory :smiley:

I don’t think the problem is the expression, the problem is that the data isn’t loaded yet at the moment the calendar initializes. Put the calendar creation in a function and call it on the load event of the serverconnect.

If you want to use the serverconnect action directly in the calendar, use the url of the serverconnect and in the server connect add an action step Response at the end, that outputs only the array. You could also use the start and end query parameters to filter your results.

image

1 Like

This does sound promising. I will try again after dinner!

On that note, i currently have the JS script in a JS file that i was loading as a Script in the head.

Can i load that JS file with the onload command in the serverconnect script? or will it only load a JS function name?

OK… THIS… This is what i needed!!! Thank the gods :slight_smile:

Ok, so obviously this worked. Thanks @patrick.

From the get go, FullCalender could always accept the PHP query, but it needed JUST the array data, and not any query names or anything.

This worked… no parsing needed.

For anyone interested, this is the simple Server Connect Query:

And this is the the JS file that calls the FullCalendar:

4 Likes

Have you include the JS source file that contains your JS function in your page? JS function has to be always called as a “static event” (not as a dynamic event) from any app connect component (except for a special way in a Flow).

I did something similar and had similar challenge (serverconnect’s static event calls the JS function before the full loading of data, which probably this is a bug).

  • What I did to solve this was, in the serverconnect dynamic success event, call an Action Scheduler with 0 sec delay and call the JS file in the static event of the Action Scheduler.

  • Other option for the action scheduler is call a flow in the serverconnect’s dynamic success event & call the JS function from the flow. Note that when you call the JS function from flow, you don’t call it as JS_function(), rather call it only as JS_function and pass the args in Args.

All the best!

Glad you solved it!