title: What is the difference between Bootstrap.js, Bootstrap.min.js, Bootstrap-table.js
body: <p>Sorry for asking such a dumb question, But I am really not clear with these.</p>
  
  <p>Bootstrap is really awesome library which save lot of work of developers.
  Since it provide the lot of feature like</p>
  
  <ol>
  <li>Save lots of time.</li>
  <li>Responsive features.</li>
  <li>Consistent design.</li>
  <li>Easy to use.</li>
  <li>Compatible with different browsers.</li>
  </ol>
  
  <p>I have started working with bootstrap recently.
  I am really confuse about few things.</p>
  
  <p>When we download the Bootstrap we get a file structure like that.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>bootstrap/
  |—— css/
  |   |—— bootstrap.css
  |   |—— bootstrap.min.css
  |   |—— bootstrap-theme.css
  |   |—— bootstrap-theme.min.css
  |—— js/
  |   |—— bootstrap.js
  |   |—— bootstrap.min.js
  |—— fonts/
  |   |—— glyphicons-halflings-regular.eot
  |   |—— glyphicons-halflings-regular.svg
  |   |—— glyphicons-halflings-regular.ttf
  |   |—— glyphicons-halflings-regular.woff</code></pre>
  </div>
  </div>
  </p>
  
  <p>So first Thing I want know is </p>
  
  <ol>
  <li>What is the difference between  <code>bootstrap.js</code> and
  <code>bootstrap.min.js</code>.    When to use <code>bootstrap.js</code> and
  <code>bootstrap.min.js</code> ?</li>
  <li>What is the difference between  <code>bootstrap.css</code> and
  <code>bootstrap.min.css</code>.    When to use <code>bootstrap.css</code> and
  <code>bootstrap.min.css</code> ?</li>
  </ol>
  
  <p>Along with the above library Bootstrap provide some more library 
  <code>Bootstrap Datatable</code> and <code>Bootstrap Table</code></p>
  
  <p><strong>Bootstrap Datatable</strong>
  <a href="https://www.datatables.net/manual/styling/bootstrap" rel="noreferrer">Bootstrap Datatable</a> </p>
  
  <p><strong>Bootstrap Table</strong>
  <a href="http://wenzhixin.net.cn/p/bootstrap-table/docs/examples.html" rel="noreferrer">Bootstrap Table</a></p>
  
  <ol start="3">
  <li><p>What is the difference between <code>Bootstrap Datatable</code> and <code>Bootstrap
  Table</code>. When should I use <code>Bootstrap Datatable</code> and <code>BootstrapTable</code>.</p></li>
  <li><p>If I include Bootstrap.js will I be able to use <code>Bootstrap Datatable</code> <code>Bootstrap Table</code>?.</p></li>
  </ol>
  
  <p><strong>Bootstrap provide jar for both of them</strong></p>
  
  <ul>
  <li><p><code>dataTables.bootstrap.js</code></p></li>
  <li><p><code>bootstrap-table.js</code></p></li>
  </ul>
  
  <p><em>This is the screen short form official site of bootstrap</em>
  <a href="https://i.stack.imgur.com/Ye5L5.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/Ye5L5.jpg" alt="enter image description here"></a></p>
  
  <p>Why I am asking because. I faced an strange issue. I was working with Boostrap Table. I include the <code>Bootstrap.js</code>, My Boostrap Table was not working, So I include the <code>bootstrap-table.js</code> and it worked.
  then what is meaning of this?
  <a href="https://i.stack.imgur.com/5qvKb.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/5qvKb.jpg" alt="enter image description here"></a></p>
  
  <p>At the same time when I was facing this issue I asked on <code>Stackoverflow</code> regarding this. and I got this.</p>
  
  <p><a href="https://i.stack.imgur.com/gG9Al.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/gG9Al.jpg" alt="enter image description here"></a></p>
  
  <p>after that I included every thing in my page.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;link media="all" rel="stylesheet" type="text/css"
   href="../resources/css/bootstrap-table.css" /&gt; 
  &lt;link media="all" rel="stylesheet" type="text/css"
   href="../resources/css/bootstrap.min.css" /&gt;
  &lt;link media="all" rel="stylesheet" type="text/css"
   href="../resources/css/dataTables.bootstrap.css" /&gt;
  &lt;link media="all" rel="stylesheet" type="text/css"
   href="../resources/css/bootstrap-dialog.min.css" /&gt; 
   
   &lt;link media="all" rel="stylesheet" type="text/css"
   href="../resources/styles/base.css" /&gt;
   
   
  &lt;script src="../resources/js/jquery-1.11.2.min.js"&gt;&lt;/script&gt;
  &lt;script src="../resources/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script src="../resources/js/jquery.dataTables.min.js"&gt;&lt;/script&gt;
  &lt;script src="../resources/js/bootstrap-dialog.min.js"&gt;&lt;/script&gt;
  &lt;script src="../resources/js/dataTables.bootstrap.js"&gt;&lt;/script&gt;
  &lt;script src="../resources/js/bootstrap-table.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>and I faced a serious issue.What was happening is.
  I had a <code>bootstrap modal table</code> and i was trying to populate the data from server side.</p>
  
  <p>every thing was fine. but I dont know why the data was not populating in the table. I struggled around 2 days. It dint work. shutdown my system and slept.
  but when I got in the morning and start the system. same code started working.
  i dint notice I was relaxed thank God its working.</p>
  
  <p>But today issue forced me to write such long question.
  I forwarded my code to my senior. Its not working there. Even he struggled a lot. and after around 2 hours of struggled the same code started working I mean the data is populating in Bootstrap table. and I swear we we dint modified any thing.</p>
  
  <p>What is the root cause of this issue? </p>