I have a pretty complex form in WordPress using Advanced Custom Fields. Unfortunately, ACF doesn't allow dynamic field population as such so I'm using jQuery to do so.
This is the code I'm using for most of the pre-population and it works great:
Working jQuery:
var $lname_mail = $("#lname-support input");
var $fname_mail = $("#fname-support input");
var $email = $("#email-support input");
if (!$("body").hasClass("badge-only")) {
$("#email-req input").keyup(function() {
$email.val( this.value );
});
$("#email-req input").blur(function() {
$email.val(this.value);
});
$("#lname-req input").keyup(function() {
$lname_mail.val( this.value );
});
$("#lname-req input").blur(function() {
$lname_mail.val(this.value);
});
$("#fname-req input").keyup(function() {
$fname_mail.val( this.value );
});
$("#fname-req input").blur(function() {
$fname_mail.val(this.value);
});
}
But what I can't seem to figure out how to get around is that on one specific form, the pre-population is dependent upon conditional logic. The form still has the initial Last Name, First Name, Email Address fields but it's followed by two different radio button choices:
I am the visitor/traveler: Yes No
I am the task sponsor: Yes No
If yes is chosen for visitor/traveler then one set of Last Name, First Name, Email Address is pre-populated based on the initial fields of the form. If task sponsor is chosen, then a different set of Last Name, First Name, Email Addressis pre-populated.
Here's the code I have tried (variables have been set-up as above but specific to this form/function) and it's not working:
Not working jQuery:
if ($('#rsb-visitortraveler-radio label').hasClass('selected')){
$("#email-req input").keyup(function() {
$bo_vis_email.val( this.value );
});
$("#email-req input").blur(function() {
$bo_vis_email.val(this.value);
});
$("#lname-req input").keyup(function() {
$bo_lname_vis_mail.val( this.value );
});
$("#lname-req input").blur(function() {
$bo_lname_vis_mail.val(this.value);
});
$("#fname-req input").keyup(function() {
$bo_fname_vis_mail.val( this.value );
});
$("#fname-req input").blur(function() {
$bo_fname_vis_mail.val(this.value);
});
} else {
}
Is this even possible with jQuery and if so, can someone please help? I worry the problem is that I'm expecting something to fire after the name input fields are entered since the radio buttons come after the name input fields. Either way, I'm out of my depth on this one.
TIA!
Aucun commentaire:
Enregistrer un commentaire