Method 1 - Adding an attribute to the input
One way to retrieve cutom values is to add the data-livecall-custom-field attribute with the value set to the name of the custom field to the input, from which you want to send the custom field value. E.g.
<input name="user[first_name]" data-livecall-custom-field="firstName" />
Keep in mind that the field name is a label in camelcase form. So e.g. label "First Name" gives "firstName" etc.
Method 2 - Using JS
The second option considers the scenario in which you use JS.
livecallClient.submitCallback('+48123123123', { customFields: { firstName: 'John' } });
In the example above firstName is an example of a custom field, and John is the value that we want to send. You can retrieve this value from any source, but you will most likely want to retrieve it from one of your form fields. Using jQuery it can be done like this:
$("input[name=user_first_name]").val()
So, to compile the two steps above you would end up with something like this:
livecallClient.submitCallback('+48123123123', { customFields: {
firstName: $("input[name=user_first_name]").val()
}});
An example could be:
<!-- LiveCall -->
<script async src="https://assets.livecall.io/accounts/8801/widget.js"></script>
<script>
$("form.widget").on("submit", function() {
var firstName = $("[name=fname]").val();
var phoneNumber= $("[name=callback-phone-number-input]").val();
livecallClient.submitCallback(phoneNumber, { customFields: {
fname: firstName
}});
});
</script>
These are the settinggs for Name in Landingi.com.
Whichever method you use, you still have to go to the LiveCall panel and make some changes there.
In the Widgets section, edit the widget that is responsible for the integration. Scroll down to Form Settings.
You should put in something like this:
Done! :)