<turbo-stream action="append" target="posts_list"><template>    <div class="postbit" id="110935" data-post-id="110935">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="grych" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/grych/120/5610_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  grych
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
			          <div class="user-title">
									<span>Creator of Drab</span>
			          </div>
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I am publishing <code>v0.10.1</code> which contains fix for that issue (and many others)</p>
<p>It is Friday evening, and I am at the airport, publishing the release. What can possibly go wrong? <img src="https://forum.elixirforum.com/images/emoji/apple/slight_smile.png?v=15" title=":slight_smile:" class="emoji" alt=":slight_smile:" loading="lazy" width="20" height="20"></p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="110935" data-batch-url="/posts/batch_likers">
                        3
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/473">Post #472</a>
	                </div>
	            </div>
              <div id="likers-container-110935" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="110935"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #472"></div>
  </section>
</div>
    <div class="postbit" id="116314" data-post-id="116314">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="doogs" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  doogs
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Is there a way to remove the debug messages “You may debug Drab functions in IEx by.. import Drab.{Modal, Element, Live, Core}.etc”</p>
<p>Especially when running in production. its just cluttering up my logging window.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="116314" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/474">Post #473</a>
	                </div>
	            </div>
              <div id="likers-container-116314" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="116314"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #473"></div>
  </section>
</div>
    <div class="postbit" id="116462" data-post-id="116462">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="grych" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/grych/120/5610_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  grych
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
			          <div class="user-title">
									<span>Creator of Drab</span>
			          </div>
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Hi doogs,<br>
it will be solved in the next release. Please be patient.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="116462" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/475">Post #474</a>
	                </div>
	            </div>
              <div id="likers-container-116462" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="116462"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #474"></div>
  </section>
</div>
    <div class="postbit" id="125433" data-post-id="125433">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="doogs" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  doogs
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Hey, If I wanted to add a Drab button to the main layout of my application how would I do that?</p>
<p>The button would be part of the main layout, not part of a specific controller/template.</p>
<p>Does this mean that I would have to create a Drab Commander for all of my controllers, then include the shared Commander on all of those other controllers?</p>
<p>Is there any easier way than that if I want the button to be accessible application wide?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="125433" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/476">Post #475</a>
	                </div>
	            </div>
              <div id="likers-container-125433" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="125433"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #475"></div>
  </section>
</div>
    <div class="postbit" id="125514" data-post-id="125514">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="OvermindDL1" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/OvermindDL1/120/2677_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  OvermindDL1
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="doogs" data-post="476" data-topic="3277">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/d/9de0a6/48.png" class="avatar"> doogs:</div>
<blockquote>
<p>Does this mean that I would have to create a Drab Commander for all of my controllers, then include the shared Commander on all of those other controllers?</p>
</blockquote>
</aside>
<p>You’d just make that button a shared commander of its own then you can put it anywhere as long as you include the drab system itself and the page itself is drabbed.  To be able to drab something you need to initialize drab after all.  <img src="https://forum.elixirforum.com/images/emoji/apple/slight_smile.png?v=15" title=":slight_smile:" class="emoji" alt=":slight_smile:" loading="lazy" width="20" height="20"></p>
<p>That is easy to automate though with a few macro’s that you can just <code>use</code> into a controller.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="125514" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/477">Post #476</a>
	                </div>
	            </div>
              <div id="likers-container-125514" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="125514"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #476"></div>
  </section>
</div>
    <div class="postbit" id="138092" data-post-id="138092">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="csadewa" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/csadewa/120/24535_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  csadewa
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>actually, now rather than having empty string as default, i use “lies:lies” as default for drab attr and it seems fine</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="138092" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/478">Post #477</a>
	                </div>
	            </div>
              <div id="likers-container-138092" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="138092"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #477"></div>
  </section>
</div>
    <div class="postbit" id="138093" data-post-id="138093">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="csadewa" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/csadewa/120/24535_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  csadewa
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Hi, just started using drab for some project. i want to dynamically add drab attribute in template (using sigil ~E), like drab=“&lt;%= drab %&gt;”, however if drab attr is set to “”, ex: &lt; input drab=“” &gt;, drab js will throw error, i currently make workaround by having two template, one with drab and one without. is there better solution than this?</p>
<p>TypeError: list is null add_form:1116:19<br>
split_drab_attribute <a href="http://localhost:4000/delivery_order/add_form:1116" rel="noopener nofollow ugc">http://localhost:4000/delivery_order/add_form:1116</a><br>
set_event_handlers <a href="http://localhost:4000/delivery_order/add_form:1165" rel="noopener nofollow ugc">http://localhost:4000/delivery_order/add_form:1165</a><br>
 <a href="http://localhost:4000/delivery_order/add_form:1227" rel="noopener nofollow ugc">http://localhost:4000/delivery_order/add_form:1227</a><br>
connect <a href="http://localhost:4000/delivery_order/add_form:267" rel="noopener nofollow ugc">http://localhost:4000/delivery_order/add_form:267</a><br>
value webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
forEach self-hosted:266<br>
value webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
value webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
value webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
e webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
value webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
value webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
decode webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
value webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
onmessage webpack:///./node_modules/phoenix/priv/static/phoenix.js?:1<br>
Source map error: TypeError: bootstrap.js.map is not a valid URL.<br>
Resource URL: webpack:///./node_modules/bootstrap/dist/js/bootstrap.js?<br>
Source Map URL: bootstrap.js.map<br>
Source map error: TypeError: popper.js.map is not a valid URL.<br>
Resource URL: webpack:///./node_modules/popper.js/dist/esm/popper.js?<br>
Source Map URL: popper.js.map</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="138093" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/479">Post #478</a>
	                </div>
	            </div>
              <div id="likers-container-138093" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="138093"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #478"></div>
  </section>
</div>
    <div class="postbit" id="138110" data-post-id="138110">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="csadewa" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/csadewa/120/24535_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  csadewa
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Also, sometime when using Drab, i need integration with javascript library (say ag-grid), i do this primarily by calling Drab.exec_elixir from browser side. Sometime i also need to get returned value (say remote data pagination), i currently do this by asking the commander to exec_js which will set corresponding variable with JSON data, then at exec_elixir callback to consume that data. I don’t think this is quite clean, what do you think?</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">defhandler drab_search_select(socket, sender) do
        %{
          "id" =&gt; html_id,
          "query" =&gt; query_text,
          "var_name" =&gt; js_var_name
        } = sender

        data = search_select(html_id, query_text)

        exec_js(socket, "#{js_var_name} = #{Jason.encode!(data)}")
      end
&lt;/pre&gt;

&lt;pre&gt;
$('#&lt;%= id %&gt;').selectize({
                      valueField: 'value',
                      labelField: 'display',
                      searchField: 'display',
                      options: [],
                      create: false,
                      load: function(query, callback) {
                          //query is a text
                          if (!query.length) return callback();
                          Drab.exec_elixir('drab_search_select', {id: "&lt;%= id %&gt;", query: query, var_name: "&lt;%= var_name %&gt;"}, () =&gt; {
                              callback(&lt;%= var_name %&gt;)
                          })
                      }
                  });
</code></pre> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="138110" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/480">Post #479</a>
	                </div>
	            </div>
              <div id="likers-container-138110" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="138110"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #479"></div>
  </section>
</div>
    <div class="postbit" id="160467" data-post-id="160467">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="aidalgol" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/aidalgol/120/38685_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  aidalgol
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I’ve just discovered Drab, and it looks amazing, but I’ve hit a wall with the first thing I want to do with it: make dynamic forms.  Specifically, I can’t figure out how to <a href="https://forum.elixirforum.com/t/poking-and-peeking-form-data/28560" rel="nofollow">poke and peek at the data in a form</a>.  Is this possible with Drab?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="160467" data-batch-url="/posts/batch_likers">
                        2
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/482">Post #481</a>
	                </div>
	            </div>
              <div id="likers-container-160467" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="160467"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #481"></div>
  </section>
</div>
    <div class="postbit" id="160738" data-post-id="160738">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="OvermindDL1" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/OvermindDL1/120/2677_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  OvermindDL1
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="aidalgol" data-post="482" data-topic="3277">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/aidalgol/48/38685_2.png" class="avatar"> aidalgol:</div>
<blockquote>
<p>Specifically, I can’t figure out how to <a href="https://forum.elixirforum.com/t/poking-and-peeking-form-data/28560" rel="nofollow">poke and peek at the data in a form </a>. Is this possible with Drab?</p>
</blockquote>
</aside>
<p>Are you talking about what the user is actively typing?  Or the data ‘you’ sent to the form?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="160738" data-batch-url="/posts/batch_likers">
                        2
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277/483">Post #482</a>
	                </div>
	            </div>
              <div id="likers-container-160738" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="160738"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #482"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <a class="load-more-button" data-turbo-stream="true" href="/topics/3277/load_more?page=49">Load more posts (8 remaining)</a>
</div></template></turbo-stream>