Note that there are some explanatory texts on larger screens.

plurals
  1. POData-binding via Dart web-ui in a Bootstrap Popover
    primarykey
    data
    text
    <p>I'm trying to use two-way data-binding to a Dart variable inside a Bootstrap Popover with no success. My code looks something like:</p> <pre><code> &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;Test Popup&lt;/title&gt; &lt;!-- Bootstrap --&gt; &lt;link href="resources/bootstrap/css/bootstrap.min.css" rel="stylesheet"&gt; &lt;link href="resources/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet"&gt; &lt;/head&gt; &lt;body&gt; &lt;button type="button" id="constcon-options-button" class="btn" title="Options" rel="popover" data-html="true" data-content=" &lt;div id='constcon-options-form' class='form-horizontal'&gt; &lt;input type='radio' name='veggies' value='kale' bind-value='veg'&gt; Kale&lt;br&gt; &lt;input type='radio' name='veggies' value='spinach' bind-value='veg'&gt; Spinach&lt;br&gt; &lt;input type='radio' name='veggies' value='carrots' bind-value='veg'&gt; Carrots &lt;/div&gt;"&gt;Options &lt;/button&gt; &lt;p&gt;veg = {{veg}}&lt;/p&gt; &lt;script type='application/dart'&gt; import 'package:web_ui/web_ui.dart'; import 'package:js/js.dart' as js; @observable String veg = 'spinach'; // Sets an initial value. Button with // value == 'spinach' is auto-selected. void main() { js.scoped(() { js.context.jQuery("#constcon-options-button").popover(); }); } &lt;/script&gt; &lt;!-- jQuery --&gt; &lt;script src="resources/jquery/jquery.min.js"&gt;&lt;/script&gt; &lt;!-- Bootstrap --&gt; &lt;script src="resources/bootstrap/js/bootstrap.min.js"&gt;&lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>This all works OK in a Bootstrap Modal (or anywhere else for that matter) but doesn't update the variable/radio buttons when in a Popover. I assume this is because the HTML is contained within the data-content="..." attribute and thus doesn't get processed by web-ui.</p> <p>Is there any other way I can get data-binding working in a Bootstrap popover?</p> <p>Thanks</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload