Databases
StackOverflow2013
Postsdbo
POre-size the modal dialog in bootstrap dynamically
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POre-size the modal dialog in bootstrap dynamically
    primarykey
    data
    text
    <p>I have a Modal Popup (Bootstrap) which displays content based on the user selection</p> <ul> <li><a href="https://stackoverflow.com/a/16152629/2260496">I've used this as my reference, Also added this to my script section in the aspx page</a></li> </ul> <p>This is the javascript code that i've used to check for the users selection</p> <pre><code>PlayerMP.getFunctionalDetails = function (type, UserID, SessionID, SessionNo) { $.ajax({ type: "GET", url: PlayerMP.URL, data: "rt=4&amp;type=" + type + "&amp;UserID=" + UserID + "&amp;SessionID=" + SessionID + "&amp;SessionNo=" + SessionNo, success: function (FunctionalSplitsJS) { if (FunctionalSplitsJS.indexOf("SessionExpired=1", 0) == -1) { $("#divFunctionalDetails").html(FunctionalSplitsJS); switch (type) { case 1: $("#divFunctionalsSplit"); //the table goes out of the modal window break; case 2: TallyFunctionalSheet(); $("#divFunctionalsSplit"); break; case 3: $("#divFunctionalsSplit"); break; } $("#divFunctionalsSplit").modal('show'); } else window.location.href = "../Login.aspx?SessionExpired=1"; } }); } </code></pre> <ul> <li>The first case has a table which is supposed to be displayed inside the modal popup but the table goes outside the modal window (there is a problem with the width of the modal window but the <code>table-responsive</code> seem to be working) But when i resize the browser to match the width of the tablet the table/modal auto resizes to match each other.</li> <li>The width of the 2nd and the 3rd case's of the modal seem to work fine.</li> </ul> <p>This is the code for the modal window thats being called</p> <pre><code> &lt;div class="modal fade" id="divFunctionalsSplit" tabindex="-1" role="dialog" aria-hidden="true"&gt; &lt;div class="modal-dialog"&gt; &lt;div class="modal-content"&gt; &lt;div class="modal-body"&gt; &lt;div class="table-responsive"&gt; &lt;div id="divFunctionalDetails"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="modal-footer"&gt; &lt;button type="button" class="btn btn-primary" data-dismiss="modal"&gt;Done&lt;/button&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <ul> <li><strong>Fullscreen Browser</strong> <img src="https://i.stack.imgur.com/YaZ9b.jpg" alt="Full screen image"></li> <li><strong>Resized Browser</strong> <img src="https://i.stack.imgur.com/RZX8t.jpg" alt="Resized Image"></li> </ul>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCommunity
    1. USjayeshkv
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. CO@FlorentHemmi that link was my reference. i've already done that. Still no go
      singulars
      1. POre-size the modal dialog in bootstrap dynamically
      1. USjayeshkv
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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