nk-o / conditionize

jQuery plugin for forms conditions to show/hide controls depending on its values.

Home Page:https://codepen.io/_nK/pen/jvdLKM

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

radio buttons are not supported

salt-istanbul opened this issue · comments

Issue description:

Hi,
radio buttons are not supported on conditionize.
I just find a simple solution for this issue. Also add a function for enable/disable required fields on show/hide event.

Version used:

v1.0.4

Code to reproduce the issue (HTML blocks + JavaScript initialization)

function conditionize_update($item, show){
	if(show){
	    $item
	    .removeClass("d-none") // bootstrap's display:none class
	    .find("[data-required]")
	    .removeAttr("data-required")
   	    .attr("required",true);		
	}else{
	     $item
	     .addClass("d-none") // bootstrap's display:none class
	     .find("[required]")
	     .removeAttr("required")
	     .attr("data-required",true)
	}
}

function conditionize_radio($item, show){
	var conditions = $item.data("cond");
	if(conditions.indexOf("&&")>-1 || conditions.indexOf("||")>-1){
	    conditions = conditions.replace("&&", "--equal--").replace("||","--or--");
		conditions = conditions.split(/--equal--|--or--/g);
		for(var i=0;i<conditions.length;i++){
		    if(conditions[i].indexOf("==")>-1){
		    	var parts = conditions[i].split("==");
			    var field = parts[0].trim();
			    var value = parts[1].trim();
			    if($(field).attr("type") == "radio"){
		            if($(field+":checked").val() == value){
		                show = true;
		             }
		         }
		    }
		}
    }else{
	    if(conditions.indexOf("==")>-1){
		    var parts = conditions.split("==");
		    var field = parts[0].trim();
		    var value = parts[1].trim();
		    if($(field).attr("type") == "radio"){
	                if($(field+":checked").val() == value){
	                    show = true;
	                }
	             }
               }
	}
	return show;
}

$( document ).ready(function() {
            $('.form').each(function(){
			if($(this).find("[data-cond]").length>0){
			    $(this).conditionize({
				    selector: '[data-cond]',
				    onCheck: function( $item, show ) {
				    	show = condizione_radio($item, show);
				    	condizione_update($item,show);
			            },
				    customToggle: function( $item, show ) {
				    	show = conditionize_radio($item, show);
				    	conditionize_update($item,show);
				    }
				});
			}
		});
});