Skip Navigation

[Resolved] Passing value from a HTML form field to a cred field

This thread is resolved. Here is a description of the problem and solution.

Problem: I would like to pass values into a Form using URL parameters.

Solution: The urlparam attribute in a cred_field shortcode can be used to specify a URL parameter to define the field value.

Relevant Documentation:
https://toolset.com/documentation/user-guides/cred-shortcodes/#cred_field

This support ticket is created 5 years, 8 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

This topic contains 4 replies, has 2 voices.

Last updated by amarildow 5 years, 8 months ago.

Assisted by: Christian Cox.

Author
Posts
#1218161

I've implemented an api (postcodeapi.nu) this makes it possible for people to enter there zipcode + housenumber so there streetname and city are pulled and filled in automatically.

The documentation I'm using for this is: hidden link

It all works. However to show the results the field needs to use an ID or a custom ID. When I create a cred form field with a the id "postcode" the result doesn't show. When I use a simple HTML form the results do show.

HTML example:
<div class="row">
<div class="form-group col-md-8">
<label for="postcode">Postcode</label>
<input type="text" class="form-control" id="postcode" placeholder="Postcode">
<span id="postcodeapi-error" class="help-block"></span>
</div>
<div class="form-group col-md-4">
<label for="number">Huisnummer</label>
<input type="text" class="form-control" id="number" placeholder="Huisnummer">
</div>
<div class="form-group col-md-6">
<label for="street">Straatnaam</label>
<input type="text" class="form-control" id="street" placeholder="Straatnaam">
</div>
<div class="form-group col-md-6">
<label for="city">Plaatsnaam</label>
<input type="text" class="form-control" id="city" placeholder="Plaatsnaam">
</div>
</div>

I would like to have the result of "Plaatsnaam" (city) to be stored as a value so I can output it as a field on a single post page.

Or would it be possible to create a custom post field called City and link it like that?

I'm working on a test environment site called zzpdesigns.nl. If login info is needed.

Is it possible to either copy the field value of the HTML field city to a cred field called city. Or add the html field city to the URL and copy the url param to a cred field?

#1218432

Hi, there's no JavaScript API for CRED / Form fields so there's not a documented way to modify those field values on some JavaScript event. Also the cred_field shortcode does not accept an ID parameter, so you can't specify your own arbitrary ID: https://toolset.com/documentation/user-guides/cred-shortcodes/#cred_field
IDs are set automatically by the Form and should not be modified. However, you can use URL parameters to set the value of some form field by URL, or use the value parameter to predefine the value with some shortcode. The cred_field shortcode accepts a parameter urlparam so you can provide some URL parameter name to use as the field value. Or you can use value attribute to set the value with PHP or some shortcode.

Note that the data formats must match up with the expected format of the field. For example, Types date fields store data in a Unix timestamp format, so you should be sure your URL parameter or shortcode attribute uses that same format.

#1218836

So if <input type="text" class="form-control" id="city" placeholder="Plaatsnaam"> receives an automatic value, in this case the name of the city. What would be the best way to store that in a URL parameter to then add to a cred field called city?

#1219056

A CRED field will only read from a URL parameter on page load. After your custom HTML form receives some value, then you must send those values to another page (where the Toolset Form exists) using URL params. That could be a standard form submission using GET, or custom JavaScript code. The workflow would be:
- Display your custom HTML form on page 1
- Use postcode API to add the appropriate values to the custom HTML form on page 1
- Redirect to page 2 where the Toolset Form is placed. Do this with a standard GET form submission, or using custom JavaScript. When you redirect to page 2, the correct URL parameters must be included in the URL in order to set the correct values in the Toolset Form.

#1219122

Hi Christian,

Thanks. The workflow was all I needed.

It seems all I had to do was add method="GET" + action="url" and add the parameter to the custom field.