I have got the post submission form which works as booking for trip (child post). Everything regarding adding post etc. working well, except the visual tweaks on form itself.
The Conditional Groups of fields being displayed or hidden only on focus on/off trigers, but I'm looking to fire these events while typing in input fields. Otherwise it's not clear for user, to click outside of input field or to select another one which is filled in already. In one word, confusing,..
Please see the live url: hidden link
Code of form:
[credform class='cred-form cred-keep-original']
[cred_field field='form_messages' value='']
<div class="cred-group cred-group-Rezervācija">
<div class='row'>
<div class="col-sm-3 cred-field cred-field-book-vards">
<label class="cred-label">Vārds<sup>*</sup></label>
[cred_field field='book-vards' post='rezervacija' value='' urlparam='']
</div>
<div class="col-sm-3 cred-field cred-field-book-uzvards">
<label class="cred-label">Uzvārds<sup>*</sup></label>
[cred_field field='book-uzvards' post='rezervacija' value='' urlparam='']
</div>
<div class="col-sm-2 cred-field cred-field-book-telefona-numurs">
<label class="cred-label">Telefona numurs<sup>*</sup></label>
[cred_field field='book-telefona-numurs' post='rezervacija' value='' urlparam='']
</div>
<div class="col-sm-4 cred-field cred-field-book-e-pasts">
<label class="cred-label">E-pasts<sup>*</sup></label>
[cred_field field='book-e-pasts' post='rezervacija' value='' urlparam='']
</div>
</div>
[cred_show_group if="($(book-vards) ne '' ) AND ($(book-uzvards) ne '' ) AND ($(book-telefona-numurs) ne '' ) AND ($(book-e-pasts) ne '' )" mode='fade']
<div class='row'>
<div class="col-sm-12 cred-field cred-field-book-insurance">
[cred_field field='book-insurance' post='rezervacija' value='' urlparam='']
</div>
</div>
[cred_show_group if="($(book-insurance) eq '1' )" mode='fade']
<div class='row'>
<div class="col-sm-4 cred-field cred-field-book-personas-kods">
<label class="cred-label">Personas kods<sup>*</sup></label>
[cred_field field='book-personas-kods' post='rezervacija' value='0' urlparam='']
</div>
</div>
[/cred_show_group]
[/cred_show_group]
</div>
<div style='display:none'>[cred_field field='_wpcf_belongs_celojums_id' value='[trip-id]']</div>
[cred_show_group if="(($(book-vards) ne '' ) AND ($(book-uzvards) ne '' ) AND ($(book-telefona-numurs) ne '' ) AND ($(book-e-pasts) ne '' ) AND ($(book-insurance) ne '1') ) OR (($(book-insurance) eq '1' ) AND ($(book-personas-kods) ne '' ))" mode='fade']
[cred_field field='recaptcha' value='' urlparam='']
[cred_field field='form_submit' value='Rezervēt ceļojumu' urlparam='']
[/cred_show_group]
[/credform]
Is it possible to create more than one child post at the single form submission? Let's say, I'd like to add more travellers - every is child post called "booking" for parent post "trip"? Can I implement JavaScript to repeat fields?
I see you have two questions.
1. Change the behavior of Conditiona Groups
2. Add more then one child each Form Submission.
We will stick to the first issue here, can you please open a new ticket with the second one?
It is not possible natively, you will need a Custom Code approach for which we can assist only limitedly.
https://toolset.com/toolset-support-policy/
Regarding the Conditional Group, the only availalbe options are:
Fade-Slide
Slide
Fade
And those will trigger only if you either check a box/radio or fill a field and Click OUTSIDE it.
If you need other approaches, it requires Custom JS Scripts, and I do not suggest to use such an approach for this reason:
1. You may want to have the user insert a SPECIFIC value (this is what most developers do with that field)
Trigerring on typing will not allow that
I apologize that the goal you try to achieve will require Custom Code.
If you need custom programming work which is beyond the scope of our support, I would suggest you consider contacting one of our certified partners from this link:
https://toolset.com/consultant/
You will get the custom assistance you need to get on with your project.
Used the checkbox as a final field to confirm values. 🙂
