How to : Pass an Array to a Server Action to Write to the Database

Step 1 : Create server side custom formatter

<?php

namespace lib\core;

function formatter_decode($val){
    return json_decode($val,true);
}

Step 2 : Create client side custom formatter

dmx.Formatter('array','stringify',  function(val) {
            return JSON.stringify(val);
});

Step 3: Create simple form on your page

<form id="formTest" method="post" is="dmx-serverconnect-form" action="./dmxConnect/api/BackOfficeV2/Testler/apiCatcher.php">
                <div class="form-row">
                    <div class="col">
                        <input id="text1" name="text1" type="text" class="form-control" dmx-bind:value="(datastore1.data).stringify()">
                    </div>
                    <div class="col">
                    <button id="btn3" class="btn" type="submit">Submit</button>
              </div>
         </div>
  </form>

*It would be very useful to have json_encode and json_decode on the server side and stringify formatters on the client side.

With these 3 steps, we have sent the datastore data in JSON format to server action. Now we can use this data in server action as we want.

Console Log

In this way, you can use the datastore component in more areas. It can be used with large forms or in shopping cart applications.
PS: datastore or other similar storage components can be used in the same way.
I hope that will be useful . :slight_smile:

7 Likes

@s.alpaslan I have a question. I tried to follow your how to doc “pass an Array to a Server Action…” Should I expect to see the custom formatter created in the steps in the formatter dialog box:

?

thank you

The answer here is no. Any custom client or server side formatters don’t show up in the UI. You have to get into code view to use it.
Also, if you make any server side modules (server action steps), they also don’t show up in the UI. You have to open the server action JSON to configure it. They are shown as “Unknown Action” wherever used.

1 Like

sid https://community.wappler.io/u/sid Wappler Pro License
October 12

The answer here is no. Any custom client or server side formatters
don’t show up in the UI. You have to get into code view to use it.
Also, if you make any server side modules (server action steps), they also
don’t show up in the UI. You have to open the server action JSON to
configure it. They are shown as “Unknown Action” wherever used.

Visit Topic
https://community.wappler.io/t/how-to-pass-an-array-to-a-server-action-to-write-to-the-database/25876/3
or reply to this email to respond.

In Reply To
dmbe11 https://community.wappler.io/u/dmbe11 Wappler Pro Educational
License
October 12
@s.alpaslan https://community.wappler.io/u/s.alpaslan I have a
question. I tried to follow your how to doc “pass an Array to a Server
Action…” Should I expect to see the custom formatter created in the steps
in the formatter dialog box: [formatter]
https://community.wappler.io/uploads/default/original/3X/6/3/632af9c7caea0a2937c2ee4a28f889871f34a98c.png
? thank you

Thank you

Visit Topic

Unfortunately, custom formatters created on the “server side or client side” do not appear in the UI.

Thanks for making, will be needing this later

1 Like

now you can do this with wappler 3.4.1. I will publish it as module and formatter in a short time.

3 Likes

Thank you, let me know when you do if you remember.

The extended formatter list for server connect v0.1 is released. (PHP)

1 Like

awesome @s.alpaslan! Thanks for this!!

With node.js, I did it in similar way with help of @JonL extension “Run JS”.
On the page, created the formatter:

<script>

dmx.Formatter('array','stringify', function(val) {

    return JSON.stringify(val);

});

</script>

On the form:

<textarea id="txt_all_invites" class="form-control" dmx-bind:value="(ds_listing.data).stringify()" name="all_invites"></textarea>

ds_listing is my DataStore.

On server action:

Captura de Tela 2022-12-13 às 10.54.12

Parse is the equivalent of Decode in JS.
Then I used RunJS output in a repeat and all worked perfect!

NOTE: Before this strategy, I was using MultiRecord Form using my DataStore as source of the repeat, but due to more than 600 rows, not all the records were going to the server (bug?).

Thanks again @s.alpaslan and @JonL!

2 Likes

Hi @otavionestares,

I am trying to do the same with a product wishlist (containing only product_ids), but have some trouble with it.

I inserted the formatter script on the form page.
My hidden form input field looks like this:
<input id="productwishlist" class="form-control" type="hidden" dmx-bind:value="(WishlistStorage.data).stringify()" name="wishlist_products">

WishlistStorage is the wishlist data store, only containing a product_id field.

This is my RunJS server action:

But I can’t figure out how to use this record output in a repeat to store the product_ids to my database.
When setting the RunJS output as the repeat expression I get this error in the console:
core.repeater: repeat is required.

Can you send an example or screenshot of how you used your RunJS output in a repeat to insert the invite values to your database or explain in general how to do this?

Thanks for any help in advance!

The output of RunJS is null, you have a mistake in your RunJS code

You inject the variable wishlist, but you’re accessing the variable wishlist_products instead

You’re also re-declaring the variable wishlist with var wishlist = (...) when you’re already injecting wishlist

1 Like

Thanks for the prompt reply @Apple, got it all working now! :smiley: :clap:

And @otavionestares thanks for this great alternative for the complicated multirecord repeat form method!! :raised_hands:

1 Like

Exactly what @Apple pointed out!