Using Server Action data inside a div (like a Repeat, but it's not an array)

Wappler General Need Help
1

Hello,

From a Server Action I have a structure like:

  • field1
  • field2
  • field3

Inside a div I want to:

<div>
<p>{{ field1 }}</p>
<p>{{ field2 }}</p>
<p>{{ field3 }}</p>
</div>

Is it possible to do so without doing like:

<div>
<p>{{ serveraction1.field1 }}</p>
<p>{{ serveraction1.field2 }}</p>
<p>{{ serveraction1.field3 }}</p>
</div>

?

The incoming data is not an array, so I can't use the Repeat element

I tried using this thing called Data Detail but it asks (I guess) for a Key and Value...

image
image796×310 13.4 KB

2

Curious what is your use case :slight_smile:

What about using inner text?

<p dmx-text="serveraction1.field1"></p>

Gabor

3

Hey Gabor!

I wanted to do like:

<div bind-data="serveraction1">
<p dmx-text="field1"></p>
</div>

Because the div is going to be cloned multiple times, and I just want to change the source of the data for each one, instead of changing every expression inside the div.

It's a bit of a niche and only for development purposes, there's an old and a new website, and I need to pull data from both (or more) to see if the data matches. So I just clone the div's and change the data source, and I look to see if everything matches!

4

I would use a repeater with a static repeat number (1), then just make sure you use the same field names for all the server actions and you are done. Shall I put something together quickly or it is enough?

5

What is it then? Is it an object?
Can you post the response from your server action so we can check what is the exact data structure?

6

@Teodor

{
  "field1": "hello",
  "field2": "world",
  "field3": "Wappler"
}

I'm not sure if this would work, the data comes from the expression, so if you were to use a number then no data would come, right?
(I'm assuming no changes to the Server Action)

7

Ah yes, you are right, then make it an array on server side and use the array as the repeat expression:

image
image973×369 14.2 KB

image
image999×263 10.1 KB

<div class="container" is="dmx-repeat" id="repeat1" dmx-bind:repeat="serverconnect1.data.output">
    <div class="row">
        <div class="col">
            <p>{{field1}}</p>
            <p>{{field2}}</p>
            <p>{{field3}}</p>
        </div>
    </div>
</div>
<div class="container" is="dmx-repeat" id="repeat2" dmx-bind:repeat="serverconnect2.data.output">
    <div class="row">
        <div class="col">
            <p>{{field1}}</p>
            <p>{{field2}}</p>
            <p>{{field3}}</p>
        </div>
    </div>
</div>
,,,

Gabor
8

Won't something like this work in your case:

<div is="dmx-repeat" id="repeat1" dmx-bind:repeat="serverconnect1.data.myvalue.values()">
    <p>{{$value}}</p>
</div>
9

Using the $key and the $value of the repeat?
Something like that?

<div class="row" is="dmx-repeat" id="repeat1" dmx-bind:repeat="json_test1.data">
        <div class="col" dmx-text="$key+' , '+$value"></div>
    </div>