umbraco/Umbraco.Forms.Issues

`includeScripts` includes the stylesheet. These should be separate values.

Opened this issue · 3 comments

When I set includeScripts to true I receive the following output:


<script defer="defer" src="/App_Plugins/UmbracoForms/Assets/themes/default/umbracoforms.min.js?v=13.1.2" type="application/javascript"></script>
<link href="/App_Plugins/UmbracoForms/Assets/themes/default/style.min.css?v=13.1.2" rel="stylesheet" />

I was unable to use includeScripts because it adds a stylesheet. I recommend these be separated in the future.

Edit: I'm also surprised that RenderUmbracoFormDependencies() does not render this script above.

It gets worse. If you disabled includeScripts you miss out on this:


<div class="umbraco-forms-form-config umbraco-forms-hidden"
--
  | data-id="be2ee399240a4a8994eadcb358cae10e"
  | data-serialized-page-button-conditions="{}"
  | data-serialized-fieldset-conditions="{}"
  | data-serialized-field-conditions="{&quot;4180564a-1753-4a39-9705-956a17a11d45&quot;:{&quot;id&quot;:&quot;293963b7-f02c-48e2-a614-d08b4829c553&quot;,&quot;actionType&quot;:&quot;Show&quot;,&quot;logicType&quot;:&quot;Any&quot;,&quot;rules&quot;:[{&quot;id&quot;:&quot;242f62f8-67d3-41c0-fdbd-285f42b383cc&quot;,&quot;fieldsetId&quot;:&quot;39801605-643c-47ab-8346-f4ea7678c74c&quot;,&quot;field&quot;:&quot;242f62f8-67d3-41c0-fdbd-285f42b383cc&quot;,&quot;operator&quot;:&quot;ContainsIgnoreCase&quot;,&quot;value&quot;:&quot;Other&quot;}]}}"
  | data-serialized-fields-not-displayed="{}"
  | data-trigger-conditions-check-on="change"
  | data-form-element-html-id-prefix=""
  | data-disable-validation-dependency-check="false"></div>

Which adds all the necessary functionality.

I can't set Html.SetFormThemeCssFile to null.

If you set includeScripts to false you need to take additional steps to render your scripts and config, usually at the end of the page. There's some details on how to do that here.

You can disable the stylesheet via form settings. Maybe it would be useful if you could separately control these via code, but you have this option:

image