Server side binding as repeat source in App Connect

Just a question, when using node especially where I have a server action action running before everything else, like for Facebook etc. I am able to choose if I want to bind something on my page with either app connect or server side bindings, which is wonderful.

My question is, is there a way to use a server side binding as a repeat.

<dmx-repeat:myrepeat="<%=_('$_PARAM.book',locals)%>">

Not in front of my computer no my syntax could be wrong above.

Never tried it either but it should work. Although you need to pass something that can be iterated by the repeat.

What is the content of book?

I figure it should work too.

So here are the 2 small issues, firstly i can not view the server action running in network tab of chrome, because it ran before everything loaded, so a little hard to show you exactly whats in there.

Secondly it runs a single database query to a bunch of linked tables which are all multi record.

this allows me to get to a single binding
<%=_('query_get_my_page_meta_data.mpc_t[0].mpc_body_copy',locals)%>

So i tried using it in a repeat like this

<div id="repeat_containers" is="dmx-repeat" dmx-bind:repeat="<%=_('query_get_my_page_meta_data.mpc_t">

But could not get that to work. any ideas @JonL

You mean that the log is cleared? There is an option to preserve logs.

Just check in console dmx.app.data.(view?).query_get_my_page_meta_data.mpc_t

1 Like

No don’t look at anything. I just saw that you are using that as an expression for the server-side binding. That expression doesn’t exist on AC only on server.

You quite right, preserve log shows it, lol, i forgot i even turned that off.

I was confused, that server action i was seeing was another one, so the server action that runs in server side rendering I do not see anywhere like in logs etc, even in dmx.app.data

So I still can not see a way for a repeat expression to be a server side rendered piece of data, maybe it is just not possible, hopefully @Teodor can enlighten me.

<script>
    dmx.Component('server_side_array', {   
        render: function () {
            this.set("data", <%- JSON.stringify(query_get_my_page_meta_data.mpc_t) %>)
        }
    });
</script>

<dmx-server_side_array id="server_side"></dmx-server_side_array>

<div id="repeat_containers" is="dmx-repeat" dmx-bind:repeat="server_side.data">
    {{mpc_body_copy}}
</div>

Result in one of my apps:

Safari 06-08-2022 01.38.11 000061

Safari 06-08-2022 01.38.44 000063

1 Like

Wow, thats amazing, thank you for going to that sort of length, its brilliant.

1 Like

You’re welcome. Don’t forget to mark it as solution if it worked for you.

Do you foresee any other scenario where you might need a Server Side binding as a repeat source besides meta tags? I might consider it building a proper extension for it with more options.

BTW, if you just wanted to loop through the array of meta data and add programatically the meta html elements you could also use an ejs block to loop through all the tags.

 <% tags.forEach(function(tag) { %>
  <meta name=<%= tag.name %> content=<%= tag.content %>>
 <% }); %> 

It’s similar to how you opened and closed those php ugly tags in the middle of your html to add server data. It’s even uglier with EJS.

1 Like

Will try it out today, im sure it will work.

To be honest I cant see why it would not be a good idea in many places.

Imagine a scenario where i have a 3 table setup
url, meta, and content
The url is brought in from the $_PARAM and once that filters the exact url then it can determine what meta is relevant to that page. It would be great if I could also link that to my page content type table which would then bring in the entire pages contents.

In my mind it would be great if server side bindings were always available as a possible repeat source as well as app connect bindings, just a bit unsure if that would have some other problems, like performance.

If you watch the 1 hour wappler meet up i did, you will see how i go about doing most of my client sites that require a cms, and that will probably give you a better idea of what I am trying to achieve, or just confuse even more as I often do, haha

To be honest I’m quite confused as to why you want this :smiley:

1 Like

See

1 Like

Basically with the way I am doing CMS stuff, i have server side rendering go off first and fetch all my meta data based upon the url the user has requested.
Then the way i currently do it, i send that ID fetched from the server side render to my first server action, and then get all the page content displayed on page via app connect bindings to the server action.

It works well this way already, but because i see Wappler gives a way to access the server connect bindings directly, I figured why not cut out the second step, and just repeat the bindings directly from the server side rendered data.

It only cuts out 2 steps, in reality, but I just figured if Wappler allows me to access it here
2022-08-06_14-03-30
then surely i could also use it in a app connect repeat or repeat children the same way.

What is preventing you from doing all that just with App Connect?

I understand html meta tags for SEO purposes but the rest?

Nothing, thats the way I am currently doing it, it was merely a brain fart, to cut out 2 extra steps, but does not really matter, was honestly more of a wondering why, i can use a server side binding in one place, and not another, just though, if possible, then why not.

Edit: to be completely honest, i just thought my syntax was incorrect, and the answer was going to be as simple as change where the single quotes are placed or something.

1 Like

Hello Paul,
What you are sharing is really fantastic – step-by-step !

My first question is about the development machine applications you are using starting here with this particular management dashboard–

What is your environment and path of applications to get to the new Wappler project?
I guess you are on a Windows machine?
Running a Docker Desktop application?

Could you add some background on what you’ve installed to be ready for the steps you show at this video’s beginning?

:smiley: I’m really enjoying the format of these meetups to see some meaty applications,

I havent really installed anything additional that is totally required

I am on a Mac and installed Wappler, which used its own homebrew and installed Docker Desktop as well.
The only different applications i use is Navicat, which is what your screenshot is showing.

I do mostly use Wapplers database manager to create most of my schema, however I often use Navicat just to add the actual records to the database, as I find the built in database manager does a couple strange things.

Thank you!
I’m on a M1 (first generation) desktop Mac. Homebrew, etc.
Docker desktop, too.

Did you install Navicat as a whole integrated suite with mysql, postresql, MariaDB, PHP, node.js, etcetera?

Or did you install another localhost server combination and just use Navicat on top as a management tool?

I installed Navicat Premium as a over the top management tool.

With Wappler using docker and nodejs you do not need to install web servers, lamp, mamp, wamp etc. there is no setup at all, wappler does it all in localhost, through docker desktop, it allows you to change from mysql to mariadb etc, it allows you to change from nodejs versions, web server versions etc, and none of it requires you to install any additional software or webserver, database server environments

1 Like