Formatters on Client Side

Wappler General Need Help
1

Hi!
I’m trying to urldecode() something on the client side. I know I need to use the javascript version.

This was helpful:

https://community.wappler.io/t/can-someone-explain-dmx-formatters-and-provide-some-reference-on-how-to-use-it/26597

But I cannot get this to work. It throws no errors, it just doesn’t decode anything. Help me please.

I have this in my file:

    <script>

        dmx.Formatters('string', {

        urlDecode(val) { 

            return decodeURI(val); 

            }

        });

    </script>

    <meta charset="utf-8">

Later on, when I’m displaying the text (in a variable/string) that needs to be changed I have this:

{{T_Question.urlDecode()}}

I don’t know why it’s not working. But, I’m not very good at javascript.
Thanks!

2

What are you trying to do?

From what I gather, from this URL https://yoursite/products.html?id="1" you want the value of the ID. If that is the case, then use the Browser component.

Choose Location

image

and pathparts

image
image458×516 12.2 KB

Because pathparts is an array. you will need to add the index value of the array as in

{{browser.location.pathparts[0]}}

Adjust the value to suit.

3

I’m not sure where you got that url from, Ben. It’s not in my project.

I’m trying to display some text.
The text is from an email that I’ve extracted, that’s now in my database.

I urlencode() from the php file that puts the email texts in the database.

So, I need to decode it to display it properly.

4

My apologies, I got it wrong. Please ignore.

5

No problem. :+1:

Anyone have an idea why this might not work?

7

Can you please provide an example of what are you trying to achieve exactly?

8

Sure! Thanks.

http://www.revolutionlink.com/TextQuestionsVersion2/
Go to that site and, for instance, choose “Control Panel” after select an amount of time.

This is for people giving speeches or sermons. While they speak, someone can text or email in questions to an address.

Control Panel loads a GetQuestions page every 15 seconds that goes out to an IMAP box and retrieves any emails or text messages. Then it stores them in the database.

Control Panel then refreshes the database every 5 seconds and lists any new questions that have come in.

But, right now
What&#39;s up in the database is simply What&#39;s up when Wappler outputs it.

So, I thought I could encode it with urlencode() so that with Wappler I can decode it and display it properly.

It’s odd because if I use my own testing file to read the database, it reads What&#39;s up as What’s up even without the decode. But, I don’t know why Wappler was reading it as What&#39;s up so I just figured I’d encode it to bypass that problem.

Does that make sense?

9

Rather than dmx-text, you can use dmx-html to put the value in an element which should interpret the &#39; as '

e.g.

<p dmx-html="T_Question"></p>
1 Like
10

Wow, it appears that works. Without any url encode/decode needed.
THANKS!!

I’ll run a few more tests to be sure.
I didn’t even know I could do dmx-html.

1 Like
11

when you use {{binding}} or dmx-text it is treated as a string whereas dmx-html treats the value as pure html and interprets it as such hence why ascii characters are converted.

1 Like
12

That makes way more sense now. Thank you!

13

There could be an issue there though… that if you just display HTML that you could inadvertently allow some malicious HTML to come through just an heads up (not sure if Wappler does some checking there though) but that’s probably why the binding is automatically text based.

14

If you are concerned about malicious code, you can take advantage of the replace function to just replace the single quote ascii in the string but leave it as a string:

<p dmx-text="T_Question.replace('&#39;','\'')"></p>
1 Like
15

@datguru That is one thing I worried about.

I do use FILTER_SANITIZE_STRING on the end when I put stuff into the DB. But, that doesn’t strip out EVERYTHING.

16

Yeah I think what @bpj suggests is a great way to do this. That way you can selectively allow certain ASCII elements through rather than all HTML to avoid some injection.

17

You can chain multiple .replace() formatters together (you may have occasions where a name has an accent, umlaut, cedilla etc.) but, depending on your requirements, another option is to use dmx-html but use .stripTags() on the value to ensure it doesn’t render with any javascript/iframe etc. that could be malicious. It would then convert all encoded ascii characters but any HTML tags would be removed.

Lots of ways to skin the cat…