Show Google map static URL link on HTML or "Text" field with populated form fields

Jonathan;

My objective is a little different, but very similar. Can you please provide some additional info on constructing the URL.

I want to simply create a link to the google map. To save screen space, I do not want to display the actual map. I want to do this on both the email notification and the actual form.

I have successfully done it on the Email Notice by using this Link...

https://www.google.com/maps?q={addrStreet},{addrCity},Ontario,Canada

However, when I try to build the same string in the form using a Text Element and editing the HTML, it does not work.

As you can see from the screenshot below, the Link string should be 'Map Link", but it starts to show the URL stirng variables. Likewise, when I hover over the link you can see the Firefox link in the lower left of the image. It has "<span class", not the name of the street or the city, etc

It appears to be some sort of missing escape characters in the HTML but I cannot figure it out.

Your assistance would be greatly appreciated.

Please try replacing the curtly brackets. The { symbol should be replaced with %7B and } with %7D. Example:

https://www.google.com/maps?q=%7BaddrStreet%7D,%7BaddrCity%7D,Ontario,Canada

Well, we're getting there. The link looks proper now, but the URL that is generated is not converted to the actual values. In other words, it won't substitute the field names with the actual field values.

The URL that is created is literally:

https://www.google.com/maps?q={addrStreet},{addrCity},Ontario,Canada

Instead of something like:

https://www.google.com/maps?q=123 Main Street,Toronto,Ontario,Canada

Unfortunately, the HTML text field is somehow sanitizing characters from the form fields if you include them as part of the target URL. 

The only way I can see you can use this is by using a Form Calculation widget. 

Here's my sample form, which is cloned from yours: https://form.jotformpro.com/71571223824958. Test it out and see if it works.

Here's how I did mine:

1. First, I added a Form Calculation widget and named it "URL".

2. In the widget, here's where I inserted the HTML code for hyperlink. I then use the "Add Field" button to get the street and city value fields. 

Note: Make sure that the color of the text are light brown which indicates a string or text value. And make sure that the value for street and city is set to "A-Z" which also means it will get the string or text value. 

3. Now get your form calculation widget's unique name/field tag. In my case, it's {url}. Open your HTML or text field and place it there without any hyperlinking. 

4. Save the changes and test your form.

I hope that helps. 

This did manage to work with some fussing with the Calculator Editor. Thx.

If you are looking for some feedback, the editor for the Conditions and Field Calculations is very frustrating to use. It should be more conducive to typing plain script.

I'm glad you're all set and thanks for the feedback. The reason why the calculate condition and calculation field's editor was designed that way was because they were mainly intended for calculations. Yes, string manipulation is possible but it's leaning more towards calculation/computation.

It's worth mentioning that you can type the URL as if you're typing plain script (as you described) on the editor, then press the Tab key to render it in the proper string format (with light brown background).

You may do this in chunks so it's easier to read as you're typing in the URL.

<a href="https://www.google.com/ (press the TAB key)

maps?= (press the TAB key)

and so on...

Related guide: How-to-Manipulate-Text-String-with-Conditions-and-Calculation