Conditional Submit

Anonymous

#244385

Hi,

Is there a way to make the submit button appear or be disabled until the dropdowns are selected?

Trevor

#244458

With the current version of the plugin, this is only possible using custom JavaScript (for which I do not have a snippet to share, sorry).

It may become possible in V3, which we are getting close to releasing (maybe towards the end of next month).

Anonymous

#248140

Hi Trevor,

I just wanted to check if the V3 will be released soon?

Trevor

#248142

Not within days, no. As with any coding project of the scale that this is, it is not possible to set a precise date. This summer is what we are planning for.

Anonymous

#248684

Hi Trevor,

I was able to achieve this with my jquery code, but the auto-update for the dropdowns keeps on refreshing the code and overwriting the disabling of submit button. I do need auto update for dropdown based on user interaction so is there a way to overwrite this on my end? If not, then can you please provide a fix on priority?

Thanks

Trevor

#248826

You can add a bit more jQuery, like this:

<script>(function ( $ ) {
  "use strict";
  $(document).on("sf:ajaxformfinish", ".searchandfilter", function(){
    // run your code here again.
  });
}(jQuery));</script>

Anonymous

#249579

Hi Trevor,

Thanks for your response.

I tried above approach but it isn’t triggering code after ajax refresh.

Basically there are 2 drop down, and I want ‘continue’ button to be disabled unless user selects a valid value in both of the dropdowns.

As soon as user selects first dropdown, page is refreshed and button is active.

Here’s the code that I am adding in page header. Please let me know if I am missing anything obvious. Thanks

<script type="text/javascript">
jQuery(document).ready(function( $ ){
	jQuery("input[value='Continue']").css('background-color','#eee').prop('disabled',true);
});

jQuery(document).on("sf.ajaxformfinish",".searchandfilter",function(){
    "use strict";
	alert('form is changed');
	jQuery('.searchandfilter .sf-field-post-meta-year').on('change', function() {
       a =  jQuery('.sf-field-post-meta-year option:checked').val();
       console.info(a);
       console.info(b);
      if((typeof a === "undefined") || (typeof b === "undefined") || (a.length == 0) || (b.length == 0)){ 
        console.info('disabled');
     	jQuery("input[value='Continue']").css('background-color','#eee').prop('disabled',true);	
      }
      else{
        console.info('enabled');
        jQuery("input[value='Continue']").css('background-color','#F96714').prop('disabled', false);
      }
    });
  
  	jQuery('.searchandfilter .sf-field-tag').on('change', function() {
       b = jQuery('.sf-field-tag option:checked').val();
       console.info(a);
       console.info(b);
      if((typeof a === "undefined") || (typeof b === "undefined") || (a.length == 0) || (b.length == 0)){ 
        console.info('disabled');
     	jQuery("input[value='Continue']").css('background-color','#eee').prop('disabled',true);	
      }
      else{
        console.info('enabled');
        jQuery("input[value='Continue']").css('background-color','#F96714').prop('disabled', false);
      }
    });
  });
});</script>

Trevor

#249603

Are the two Auto Count settings enabled in your form, and possibly also you would need Hide Empty set on both fields. Without that, the search form would not trigger ajaxformfinish.

Anonymous

#252497

Hi Trevor,

Yes, I have both auto count settings enabled since I need 2nd drop down to be refreshed based on value selected in first dropdown.
As you mentioned hide empty is also set.

Could you please let me know when are you planning to push the requested feature since whatever I try isn’t working as of yet and auto count settings and hide empty checkbox are needed for other functionality so can’t disable them.

Hoping to get requested feature soon. Thanks

Requested feature: An option to disable (grey out) submit button until some values are selected in dropdowns.

Trevor

#252617

You say you have two form fields. Are you able to send me a live link/URL to your search page so I can take a look? I would be looking to make sure that both fields are not based on the same data source, e.g. two fields based on ‘Category’.

It would be best to create a separate feature request for the disabled submit button in the feature request forum.

[Author]

Posts