Forums

As per subject: everything regarding tooltips seems to be OK when labels are set in 'left' position, but no tooltip icons at all when labels are on 'top' of the field.
For the example: http://www.orebic.info/bicycle-rental-in-orebic.html (text area field has label set 'left'), so it's the only one showing the tooltip icon.

Hi Idajak,

I am seeing the same problem as you on my website but after viewing your site it looks like you found a fix.

Can you share what you did to fix the problem?

Thanks

Hi Idajak,

After re-reading your post and looking at the code on your page i realized you didn't find a fix after all. Sorry I jumped the
gun on that one. I thought you had found a fix because your label was on top of your text area so I made the assumption
the label was set to top.

in my own testing I can't figure out for the life of me what triggers the tooltip to appear. The only thing that changes in my code view is 2 css classes. When setting the label left the label class is "gcore-label-left" and the div class around my field is "gcore-display-table gcore-input".

When changing it to label top my label class is "gcore-label-top" and the div class around my field is "gcore-display-table gcore-input-wide".

Other than that the rest of the code looks the same, even the tooltip text still appears in the code. (The code I have been referring to is in the ChronoForms backend code view.)

When viewing the code in my browsers developer tools and having my label set to left I see an i class added in the code for the tooltip. If I switch to label top then the i class for the tooltip is no longer there.

I would have to assume the tooltip is added with js some how and one of the 2 css classes above somehow trigger it to appear.

Hopefully Max or Bob will have a solution for this.

Max or Bob,

I did a little more digging to try and figure this out.

As I mentioned above there were 2 classes that changed in the wizard code depending on whether label "Top" or "Left" was chosen.

I found when in the code tab and I switch the Form Type from "Wizard Designer" to "Custom Code" then go to my field using the tooltip in which part of the css class is "gcore-display-table gcore-input-wide" and change to "gcore-display-table gcore-input", then save the tooltip will appear on my website.

I also found this in my forms web page source code, not sure but i think it might be what triggers the tooltip to appear.

jQuery(document).ready(function($){
				$("#chronoform-event-submission-form").find(":input").each(function(){
					if($(this).data("tooltip") && $(this).closest(".gcore-input").length > 0 && $(this).closest(".gcore-input").next(".input-tooltip").length < 1){
						var $tip = $('<i class="fa fa-exclamation-circle input-tooltip" style="float:left; padding:7px 0px 0px 7px;"></i>').attr("title", $(this).data("tooltip"));
						$(this).closest(".gcore-input").after($tip);
					}
				});
				$("#chronoform-event-submission-form .input-tooltip").gtooltip("hover");
			});

If it is, there is no reference to "gcore-input-wide" but there is reference to "gcore-input" so this may be where the bug is but I have no idea how to fix it.

Hello,

Bug found and fixed, to be available in the next release! Thank you!🙂

Regards,
Max