Merge branch 'master' of github.com:ratiw/vue-table into develop

Author: ratiw

README.md

@@ -13,13 +13,20 @@ vuetable - data table simplify!
 - Define row actions and capture the click event to do whatever you want
 - Field display customizable via callback function inside Vue.js instance
 - Programmatically show/hide any field via reactivity of fields definition
-- Use your favorite CSS framework classes to nicely format your table and dispalyed data
+- Use your favorite CSS framework classes to nicely format your table and displayed data
 - Events to allow control from Vue.js instance programmatically
 - Capture events from `vuetable` to manipulate your table and your data
 - Should work with any pre-defined JSON data structure
 - Should work with any CSS Framework, e.g. Semantic UI, Twitter's Bootstrap
 - Optional detail row to display additional data (v.1.2.0)
 
+## Note on vue-resource version
+vuetable internally uses vue-resource to request data from the `api-url`. Prior to v1.5.3, vuetable uses vue-resource v0.7.4 and it retrieves the returned data from `response.data` object. However, since [v0.9.0](https://github.com/vuejs/vue-resource/releases/tag/0.9.0) the `response.data` has been renamed to `response.body`. vuetable v1.5.3 onward has been updated to use vue-resource v1.0.2.
+
+This will cause problem with vuetable to display no data because the expected object key is no longer existed and some other related problems as discussed in [#100](https://github.com/ratiw/vue-table/issues/100).
+
+**If you're using vue-resource in your project and the version is 0.9+, please upgrade to use vuetable v1.5.3.**
+
 ##Breaking Changes
 ####v1.5.0
   - deprecated props
@@ -198,7 +205,7 @@ Then, reference the vuetable via `<vuetable>` tag as following
 					'lastname',
 					'nickname',
 					'birthdate',
-					'group.name_en'
+					'group.name_en',
 					'gender',
 					'last_login',
 					'__actions'

dist/vue-table.js

@@ -638,8 +638,8 @@ exports.default = {
 
             var url = this.apiUrl + '?' + this.getAllQueryParams();
             this.$http.get(url, this.httpData, this.httpOptions).then(function (response) {
-                self.tableData = self.getObjectValue(response.data, self.dataPath, null);
-                self.tablePagination = self.getObjectValue(response.data, self.paginationPath, null);
+                self.tableData = self.getObjectValue(response.body, self.dataPath, null);
+                self.tablePagination = self.getObjectValue(response.body, self.paginationPath, null);
                 if (self.tablePagination === null) {
                     console.warn('vuetable: pagination-path "' + self.paginationPath + '" not found. ' + 'It looks like the data returned from the sever does not have pagination information ' + 'or you may have set it incorrectly.');
                 }

dist/vue-table.min.js

@@ -268,7 +268,7 @@ <h4 class="panel-title">Visible fields</h4>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.12.0/moment-with-locales.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.24/vue.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/0.7.0/vue-resource.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.2/vue-resource.min.js"></script>
 <script src="../dist/vue-table.js"></script>
     <script>
     var E_SERVER_ERROR = 'Error communicating with the server'

examples/bootstrap.html

@@ -194,7 +194,7 @@ <h3 class="ui header">List of Users</h3>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.12.0/moment-with-locales.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/0.7.0/vue-resource.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.2/vue-resource.min.js"></script>
 <script src="../dist/vue-table.js"></script>
 <script>
     $('#settingsModal').modal({

examples/semantic.html

@@ -1,11 +1,11 @@
 {
   "name": "vuetable",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "description": "vue.js table component that will automatically request JSON data from server and display them nicely in HTML table with swap-able/extensible pagination component",
   "main": "dist/vue-table.js",
   "dependencies": {
-    "vue": "~1.0.21",
-    "vue-resource": "~0.7"
+    "vue": "^1.0.26",
+    "vue-resource": "^1.0.2"
   },
   "directories": {
     "example": "examples"

package.json

@@ -423,8 +423,8 @@ export default {
             var url = this.apiUrl + '?' + this.getAllQueryParams()
             this.$http.get(url, this.httpData, this.httpOptions)
                 .then(function(response) {
-                    self.tableData = self.getObjectValue(response.data, self.dataPath, null)
-                    self.tablePagination = self.getObjectValue(response.data, self.paginationPath, null)
+                    self.tableData = self.getObjectValue(response.body, self.dataPath, null)
+                    self.tablePagination = self.getObjectValue(response.body, self.paginationPath, null)
                     if (self.tablePagination === null) {
                         console.warn('vuetable: pagination-path "' + self.paginationPath + '" not found. '
                             + 'It looks like the data returned from the sever does not have pagination information '