[jerkski]

Felix! This is fantastic!! I found that I needed to add a blank option to the dropdown to force Chosen not to prepopulate with anything. Otherwise, it always preselected the 1st option in the dropdowns options, even if it was not set as the default. Also, I found I had to disable Uniform to get this to work.

Fantastic work!! Honestly, I wish Quform would adopt better styling and functionality like this. What you have done with Quform is nothing short of amazing, and I think you could create an even more dynamic product!

[jerkski]

To me it doesn’t matter. It seems like most of these jquery scripts include an ability to fetch the values and labels from a db or Json. My programmer might prefer that since it is standardized. I was originally thinking that they could be passed on to the script when the form loads via a function in an array, and we could access that way. Normally to get actual submitted data, we add some code to the functions.php, add an HTML element to alter to look and functionality of the data being displayed.

So that’s where I’m stuck. How do I access the labels and values of an existing dropdown element. Any way you could help, I’d appreciate it. Whichever method makes more sense for quform is what I’ll use. Once you get you get us going, I’ll have my programmer share his code here as I feel it would be a nice addition to quform, to make more dynamic, angular type elements.

Thanks Felix!

BTW – This looks to be a better option for jquery dropdown with autocomplete: https://harvesthq.github.io/chosen/

[jerkski]

Based on my above comment, we are trying to figure out if when I create a form in Quform, are the form field labels and values stored in the database? How can I access these in an external script?

[jerkski]

Hi Felix, thank you for the suggestion. I am looking to improve upon the existing process to make it easier for users and to reduce the amount of scrolling required in a dropdown with many options, and when there are many options and they select more than one, this would make it easier to review selections prior to submitting. In my example, my single dropdown has about 50 options. Out of those, users normally select upwards of 6-8 at a time. What is confusing is for the users to review which ones they chose. They are forced to look through the long list again to see which they control+selected.

I still would like to research integrating the above method I posted in the link, but my developer and I do not know where we can get the Quform stored labels/values from for the dropdown options. In other words, we would like to build the dropdown as usual in Quform along with the labels/values we set in Form Builder, but use some jQuery and styling to alter the functionality and appearance of the dropdown. Does this sound possible?

[jerkski]

Resolved! Thank you Ally! Figured it was something easy…

[jerkski]

I figured it out… I have a comma accidentally added in the database settings for the form. Once I did that, the radio selection was automatic. Solved.

[jerkski]

I will try it out. Thank you!

[jerkski]

Hello, hoping this is a simple fix. I can do the same with isset for date, but for some reason doing the same procedure for time results in the value of my variable being 12:00 am no matter what time is actually in $_SESSION[‘iphorm_2’][‘iphorm_2_18’]

Any ideas?

[jerkski]

Found a better way!

<script>
jQuery(document).ready(function ($) {
$(‘.iphorm_2_36’).click(function(){

var $chkA = $(this),
value1 = $chkA.val(),
chkUnchk = $chkA.is(‘:checked’),
ampX = ”;

switch (value1) {
case ‘1’:
ampX = ‘.iphorm_2_154’;
break;
case ‘2’:
ampX = ‘.iphorm_2_153’;
break;
case ‘3’:
default:
ampX = ‘.iphorm_2_155’;
break;
};
$(ampX).each(function () {
$(this).prop(‘checked’, chkUnchk);
});

jQuery.uniform.update();
}).change();
});
</script>

[jerkski]

Well, here is my crack at it… It works, but I think my code is getting confused because it selects the correct group of checkboxes, but then checking or unchecking another box deselected that group. Any tips on how to simplify this?

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value1 = jQuery(this).val();
var $amp1 = jQuery(‘.iphorm_2_154’);
$amp1.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value1 == ‘1’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value2 = jQuery(this).val();
var $amp2 = jQuery(‘.iphorm_2_153’);
$amp2.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value2 == ‘2’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value3 = jQuery(this).val();
var $amp3 = jQuery(‘.iphorm_2_155’);
$amp3.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value3 == ‘3’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value4 = jQuery(this).val();
var $amp4 = jQuery(‘.iphorm_2_156’);
$amp4.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value4 == ‘4’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value5 = jQuery(this).val();
var $amp5 = jQuery(‘.iphorm_2_157’);
$amp5.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value5 == ‘5’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value6 = jQuery(this).val();
var $amp6 = jQuery(‘.iphorm_2_158’);
$amp6.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value6 == ‘6’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value7 = jQuery(this).val();
var $amp7 = jQuery(‘.iphorm_2_159’);
$amp7.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value7 == ‘7’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value8 = jQuery(this).val();
var $amp8 = jQuery(‘.iphorm_2_160’);
$amp8.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value8 == ‘8’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value9 = jQuery(this).val();
var $amp9 = jQuery(‘.iphorm_2_161’);
$amp9.each(function () {

if(jQuery(‘.iphorm_2_36’).is(“:checked”)&& value9 == ‘9’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value10 = jQuery(this).val();
var $amp10 = jQuery(‘.iphorm_2_162’);
$amp10.each(function () {

if(jQuery(‘.iphorm_2_36′).is(“:checked”)&& value10 == ’10’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value11 = jQuery(this).val();
var $amp11 = jQuery(‘.iphorm_2_163’);
$amp11.each(function () {

if(jQuery(‘.iphorm_2_36′).is(“:checked”)&& value11 == ’11’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value12 = jQuery(this).val();
var $amp12 = jQuery(‘.iphorm_2_164’);
$amp12.each(function () {

if(jQuery(‘.iphorm_2_36′).is(“:checked”)&& value12 == ’12’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value13 = jQuery(this).val();
var $amp13 = jQuery(‘.iphorm_2_165’);
$amp13.each(function () {

if(jQuery(‘.iphorm_2_36′).is(“:checked”)&& value13 == ’13’) {
jQuery(this).prop(‘checked’, true);
} else {
jQuery(this).prop(‘checked’, false);
}
});
jQuery.uniform.update();
}).change();
});
</script>

[jerkski]

I got the following to work for selecting all checkboxes in a checkbox group. Is there any way I can get it to also deselect the checkboxes as well. iphorm_2_36 is my primary checkbox, and

<script>
jQuery(document).ready(function ($) {
jQuery(‘.iphorm_2_36’).click(function(){
var value = jQuery(this).val();
var $amp = jQuery(‘.iphorm_2_154’);
$amp.each(function () {
{
jQuery(this).prop(‘checked’, true);
}
});
jQuery.uniform.update();
}).change();
});
</script>

[jerkski]

Hello, I know its been a while on this topic…I have implemented this in the past, but am now having trouble. My email confirmation looks exactly the way I want. When I implement the confirmation redirect (based on the email template) as you explained, it works, but I am getting a whole bunch of extra fields. It seems like the email is only showing data that was selected, whereas the confirmation redirect is showing those fields and some that were not selected. Is there a way to make it work exactly like the email?

Also, I noticed the email subject can have the Entry ID in it. Is there a way I can have the confirmation redirect page show the Entry ID the same way?

• This reply was modified 8 years, 8 months ago by jerkski.

[jerkski]

Perfect! You know your stuff! Thank you Ally. You may mark this as solved 🙂

[jerkski]

Ally, Thank you!! Works great! The second example you posted is the one i needed. Is there a quick way to allow changing the radio selection for many quform fields at the same time with the above example? Or do I need to create variables and functions for each radio I need to control?

• This reply was modified 9 years ago by jerkski.

[jerkski]

Hi Ally, related to this…when I try to submit the form data, even though the gender radio is chosen, the submit logic thinks that it is not. Is there something else that I am missing that would prevent it from submitting? Visually, it shows the proper radio is selected.

[Author]

Posts