Databases
StackOverflow2013
Postsdbo
POjQuery moving DOM element outside parent
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery moving DOM element outside parent
    text
    copied!<p>I have a layout like:</p> <pre><code>&lt;header class="header"&gt; &lt;div class="logo"&gt;Logo Here&lt;/div&gt; &lt;nav class="menu"&gt;Menu Here&lt;/nav&gt; &lt;/header&gt; &lt;div class="container"&gt; &lt;aside class="aside"&gt; &lt;!-- Here are the Buttons that Filters the Content in .main-content class --&gt; &lt;/aside&gt; &lt;div class="main-content"&gt; &lt;!-- The list of contents here are shown according to the filter in sidebar --&gt; &lt;!-- The contents are lets say only tables and Ajax button does its filter --&gt; &lt;div class="export-link"&gt;Export Link&lt;/div&gt; &lt;!-- This export list is created by Ajax and for every filter value the link changes --&gt; &lt;/div&gt; &lt;/div&gt; &lt;footer class="footer"&gt; &lt;div class="some-links"&gt;Some Links&lt;/div&gt; &lt;/footer&gt; </code></pre> <p>I want that <code>div.export-link</code> to place in <code>nav.menu</code>.</p> <p>At first I did something like</p> <pre><code>if($('.new__nav-class').length === 0 ){ $('.menu, .export-link').wrapAll('&lt;div class="new__nav-class"&gt; &lt;/div&gt;'); } </code></pre> <p>This places the <code>div.export-link</code> and <code>nav.menu</code> inside new <code>div.new__nav-class</code> in the header section, and I can apply CSS to make it pretty.</p> <p>However the problem is it doesn't take the filter value anymore. The <code>link</code> inside the <code>.export-link</code> used to change according to the filter like <code>href="/page?Thisfilter-Thatfilter"</code>, but since I put the wrapper in top of the div and placed it in the menu, the link has become static.</p> <p>Any solution how to fix this?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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