This topic contains 5 replies, has 2 voices, and was last updated by 
- Topic
I am building a membersite where the members can specify what their specialties are, and what services they offer and which services not.
This is implemented by a large list of services (radio buttons), and for each service 3 options:
– favorite
– offered
– not offeredTo avoid that a member marks everything as favorite, I want to limit the number of services that he can mark as favorite.
How to do that?
Also, I would like to maintain a counter visible on screen, so that he can see how many favorites are marked.
How would I do that?
- Replies
Hi,
I think this can be done with custom JavaScript only. So you need to enqueue a JS file, and in that file track the number of choice and show an alert when they select more.
OK, so that will be quite some work. Doubt whether it’s worth the efforts.
Thanks.Hi Anh,
I have taken up this idea again to limit the number of favorites.
Currently the number of favorites is counted and that number is shown on screen.What I want to do next is to dim the Save/Confirm button as long as the counter is higher than the number of allowed favorites.
How can I do that?
In the latest version of the MB Frontend Submission plugin, I added some code to disable the submit button when it’s already clicked (to prevent duplicated submission). You can take it as a sample and write your own code, like this:
function count_favorites() {...} $( 'input[type="radio"]' ).on( 'change', function() { var $submitButton = $( '.rwmb-form-submit' ).children( 'button' ); if ( count_favorites() > 3 ) { $submitButton.prop( 'disabled', true ); } else { $submitButton.prop( 'disabled', false ); } } );Hi Anh,
To count the number of favorites, I have the following JS:
jQuery(document).ready(function( $ ){
$(document).ready(function () {
$(‘.count input’).attr(‘readonly’, true);
$(‘.radio’).change(function () {
var count=0;
$(‘.radio input:checked’).each(function(){
if ($(this).val().replace(/V_/g,”)==”Specialiteit”) {
count += 1;
}
});
$(‘.count input’).val(count);
});
});
});That works nicely. (Btw: “Specialiteit” = Specialty, so I’m counting the specialties instead of favorites)
How to add your code there?
I created another JS file with the following code, but the submit button never gets disabled.
$( ‘input[type=”radio”]’ ).on( ‘change’, function() {
var $submitButton = $( ‘.rwmb-form-submit’ ).children( ‘button’ );
if ( .count() > 3 ) {
$submitButton.prop( ‘disabled’, true );
} else {
$submitButton.prop( ‘disabled’, false );
}
} );
You must be logged in to reply to this topic.