Forums

When you add a toggle shown event to a segment area driven from a button click, the resultant javascript code not only switches visibility of the segment div but also propagates the fields within and switches their visibility also.

In my use case I have set of fields within a segment and some of those fields have logic to hide them when not needed. When I show the segment area I want them to remain hidden. Not sure if what currently happensis intended behaviour or not, but I have found a fix that works well for my needs.

In file ~/plugins/system/chronog3_plg/chronog3/assets/js/g3.forms.js around line 304 I modified 3 functions to the below:

		Page.on('show.gevents', '[data-uid]', function(e, data){
			e.stopPropagation();
			if(data.result == true){
				if($(this).hasClass('segment')){
					/* if its a segment just show the segment div */
					$(this).removeClass('hidden');
				}
				else{
					$(this).find('.mainfield').addBack().removeClass('hidden');
				}
			}
		});
		
		Page.on('hide.gevents', '[data-uid]', function(e, data){
			e.stopPropagation();
			if(data.result == true){
				if($(this).hasClass('segment')){
					/* if its a segment just hide the segment div */
					$(this).addClass('hidden');
				}
				else{
					$(this).find('.mainfield').addBack().addClass('hidden');
				}
			}
		});

		Page.on('toggle_show.gevents', '[data-uid]', function(e, data){
			e.stopPropagation();
			if(data.result == true){
				if($(this).hasClass('segment')){
					/* if its a segment just toggle on/off the segment div */
					if($(this).hasClass('hidden')){
						$(this).removeClass('hidden');
					}
					else{
						$(this).addClass('hidden');
					}
				}
				else{
					if($(this).find('.mainfield').addBack().hasClass('hidden')){
						$(this).trigger('show.gevents', {'result':true});
					}else{
						$(this).trigger('hide.gevents', {'result':true});
					}
				}
			}
		});