http://redmine.emweb.be/http://redmine.emweb.be/favicon.ico?16934085252022-09-06T14:01:31ZRedmineWt - Support #10871: Bootstrap 5 Forms with floating labels are not corretcly rendered with progressive-bootstrap=truehttp://redmine.emweb.be/issues/10871?journal_id=475692022-09-06T14:01:31ZRoel Standaertroel@emweb.be
<ul><li><strong>Target version</strong> set to <i>4.9.0</i></li></ul> Wt - Support #10871: Bootstrap 5 Forms with floating labels are not corretcly rendered with progressive-bootstrap=truehttp://redmine.emweb.be/issues/10871?journal_id=482392022-10-06T07:54:26ZRoel Standaertroel@emweb.be
<ul><li><strong>Target version</strong> changed from <i>4.9.0</i> to <i>4.10.0</i></li></ul> Wt - Support #10871: Bootstrap 5 Forms with floating labels are not corretcly rendered with progressive-bootstrap=truehttp://redmine.emweb.be/issues/10871?journal_id=517042023-03-10T13:32:13ZRoel Standaertroel@emweb.be
<ul><li><strong>File</strong> <a href="/attachments/5532">bs5_forms.cpp</a> <a class="icon-only icon-download" title="Download" href="/attachments/download/5532/bs5_forms.cpp">bs5_forms.cpp</a> added</li><li><strong>Tracker</strong> changed from <i>Bug</i> to <i>Support</i></li><li><strong>Status</strong> changed from <i>New</i> to <i>Closed</i></li><li><strong>Target version</strong> deleted (<del><i>4.10.0</i></del>)</li></ul><p>The problem is simply that you are using a <code><form></code> tag in your template.</p>
<p><code><form></code>s can't be nested, and Wt without JavaScript (e.g. when using progressive bootstrap) automatically adds a <code><form></code> tag around the entire page.</p>
<p>Just change your <code><form></code> to a <code><div></code>.</p>
<p>Another issue in your sample: you are reusing the same <code>id</code>. You should use the <code>id</code> function instead so that Wt can dynamically add the right id to the <code>for</code> attribute of the <code><label></code>.</p>
<p>I attached a fixed version of your code.</p>