SIGN UP

How to add javascript too a form

By: Martin Splinter | Asked: 09/09/2022
Forums › Category: Code Help › How to add javascript too a form
0 Vote Up Vote Down
Martin Splinter asked 2 years ago
So, hi there, my name is Martin, a 44 year old captain who took it upon himself to create an webapp with formidable forms. to make my life easier.

I use formidable forms to create documents in pdf form for various purposes. Its really helpfull as i have made the proces of document creation much faster.

Per example, where i would need 12 minutes to create documents for a bunker delivery of fuel oil, i do that in 2 minutes now, and once i get smarter, ill bring that down to 1.

I have learned a lot over the last year, and thats an understatement, but i am far from being a programmer.
So thats why i am here, to see if some people with real skils can help me now and then.

My first questionis one which will solve probably two of my issues at the moment.
I need to add some javascript to a form, because in my opinion the formidable geo plugin is not really advanced.

I was reading in the source code, and it seesm that what i need was once on the todo list, but was never finished. From the readme:

@todo:
* Add hidden fields for lat & lon (those are there)
* Fill hidden fields (lat & lon) when address is selected That happens
* Save lat & lon to item meta
that also happens if the fields are invisible, but for some reason not when i make them visible.

however as in my usercase i have three addresses i lookup and i need to lon and lat for all three the locations, I made them visible but i cant use the values in my forms.

If i use post meta they dont show up. if i use ajax and then a get/post then also i dont see them

So i edited the file FrmGeoAppController.php line 188 and up so that the fields are visible now and i can copy the lon and lat values manually.

But thats not what i want ofcourse, i want them stored as a value. but whatever i try, i cant.
As its available in the browser, but not a real field in the form from formidable perception, i think i can catch that value in javascript and then put it in a empty field and then store it. but i have no clue how to do it.

I found some jquery code that could do it, but i dont know where to put it, how to reference the right values and such. There may be a better way, and i did see a plugin that i can buy, but thats no fun. * Add autocomplete for address field type (the JS is copy/paste from WPforms) works * Field Setting: show map with field to move the pin to choose the location works
* Field Setting: default value for current location?
* Global settings: Add a tab for Geolocation. This tab will include an API key field. * Show the location in the admin sidebar when viewing or editing an entry works, but is not what i need
* Add shortcode parameters to show map, lat, or lon in a View like [25 show=lat], [25 show=lon], [25 show=map] doesnt work for me it just prints it as text, so i guess the shortcode is not implemented yet.

I short (if thats  not to late already), i have a form with 3 addresses of which i need the long and lat, i use that data to sent to zapier to make an api request to a service that does routeplanning. I know take the name and use an extra apicall to a geolocation api, get the results, and then continue my flow, but i have seen it, and now i want it.

Is there a way of getting a value that i see on my screen and in the developer tools into a field in formidable?

if so where would i put that? and how?


This stays empty:
<input type="text" id="field_v1mqg" name="item_meta[3662]" value="[3225 show=lon]" data-frmval="[3225 show=lon]" data-invmsg="Tekst is ongeldig" class="form-control" aria-invalid="false"> where field 3225 is the addres field. changing [3225 show=lon] to [3225 show=geo_lat] does not help

I do see the lon and lat which was looked up in the adress field on my screen, in this field:
<input type="text" input="" id="geo-lat-3225" name="geo_lat[3225]" class="frm-geo-lat" value="" aria-invalid="false">

I created an empty field with default value in different setups, but it does not get filled with the right value.


u can see it here: https://shipdocs.app/burando/handig/routeplanner-test/

i hope my rambling are forgiven, its sometimes overwhelming for my brains, the endless posibilities.

I just realised that i could just not use formidable-geo, pass the location names to the api i use and it will probably be able to figure out which lon and lat it is, however that wont make me smarter.


2 Answers
1 Vote Up Vote Down
Best Answer
Rob LeVineRob LeVine answered 2 years ago
I just did the following and it worked for me. I created a GEOlocation field and two text fields. I added the following JQuery code to get the lat and long from the address field's hidden elements and put them into the text fields. GEOLocation field key = afcxy GEOLocation field id = 419 Latitude = hc0ts Longtitude = ih84b jQuery(document).ready(function($) { $("#field_afcxy").change(function () { var lat = $("#geo-lat-419").val(); var lng = $("#geo-lng-419").val(); $("#field_hc0ts").val(lat); $("#field_ih84b").val(lng); }); });
Rob LeVineRob LeVine replied 2 years ago

I don't think the " tags" work on this forum.

Martin Splintger replied 2 years ago

Thank you! i really appriciate it. What do you mean that tag not working here? I hgope i can copy and paste, else ill be lost ))

Rob LeVineRob LeVine replied 2 years ago

I mean that instead of looking like code with line breaks and indents, it looks stront as the Dutch might say.

Martin Splintger replied 2 years ago

🤣👍 this bdutchie will try to add that stront to the form and see what happens ))

Many thanks

Martin Splintger replied 2 years ago

but uh..... where do i add the jquery code into formidable? In de custrom html?

Rob LeVineRob LeVine replied 2 years ago

Add the whole thing, wrapped by and in the After Fields section within Customize HTML

0 Vote Up Vote Down
Martin Splinter answered 2 years ago
Wow!!! it works, many thanks man, this really helkps me, and also helps me beyond this point.

it showed me that i was c lose, but confused with field id, names and how to call it all. But could not have done it without your help! 
Rob LeVineRob LeVine replied 2 years ago

Does this mean if I ever need a ship I can have one for free?

Martin Splintger replied 2 years ago

Unfortunately not, but on the upside: it does mean that if ever happen to have a question in that direction, I will definitely supply you with an answer!

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community
crossarrow-right