title: how to update data in bootstrap table
body: <p>I have one bootstrap table with following code.</p>
  
  <pre><code>  &lt;table id="tblPendingRequests" data-height="300"&gt;
         &lt;thead&gt;
            &lt;tr&gt;
               &lt;th data-field="Version"&gt;Version&lt;/th&gt;
               &lt;th data-field="Env"&gt;Env&lt;/th&gt;
               &lt;th data-field="Release"&gt;Release&lt;/th&gt;
               &lt;th data-field="CreatedBy"&gt;Created By&lt;/th&gt;
               &lt;th data-field="Action"&gt;Action&lt;/th&gt;
            &lt;/tr&gt;
        &lt;/thead&gt;
     &lt;/table&gt;
  </code></pre>
  
  <p>added below references also. </p>
  
  <pre><code>&lt;script src="~/Scripts/bootstrap-table.js"&gt;&lt;/script&gt;
  &lt;link href="~/Content/bootstrap-table.min.css" rel="stylesheet" /&gt;
  </code></pre>
  
  <p>and my jquery code to load data</p>
  
  <pre><code>     function loadData()
       {
         $(function () {
          $('#tblPendingRequests').bootstrapTable({
          });
        });
       }
  </code></pre>
  
  <p>and then I am loading some data to this table. Like this:</p>
  
  <pre><code>var mydata = { "Version": data[index].DeploymentName, "Env": data[index].EnvName, 
                    "Release":data[index].ReleaseName, "CreatedBy": data[index].UpdatedBy  "Action": ActionButton };
              testData.push(mydata);
        updateData(testData);
    function updateData(myData) {
       $('#tblPendingRequests').bootstrapTable("append", myData);
  
        }
  </code></pre>
  
  <p>It is diplaying the data properly. I have one project dropdown on the page. Onchange of the project name i want to populate this table with fresh data. It is not happening. It is appending data to existing table data which i don't want. </p>
  
  <p>How to refresh the table and load new data in the table. </p>