This is a migrated thread and some comments may be shown as answers.

Grid not updating with page 2, 3, 4, etc.

7 Answers 129 Views
This is a migrated thread and some comments may be shown as answers.
Brad
Top achievements
Rank 1
Brad asked on 16 Nov 2018, 12:46 PM

I am using the Grid, but manipulating the URL with search parameters.  The first page works great, showing the total rows, number of pages, etc.  When navigating to other pages, I can see that the grid is successfully generating and hitting the URL.  Within the change() event, I can see the correct rows returned.  However, the grid is not updating with the new content.  Is there something else I need to do?

Here is the grid definition

<kendo-grid ref="gridComponent"
                      :data-source="quotes"
                      :auto-bind="true"
                      :selectable='true'
                      :sortable='true'
                      :resizable='true'
                      :pageable-page-size="pageSize"
                      :pageable-page-sizes='true'
                      :pageable-button-count='5'
                      :reorderable='true'
                      :no-records="noRecords"
                      v-on:databinding="onDataBinding"
                      v-on:databound="onDataBound"
                      v-on:change="rowSelected"
                      :sort="sortFilter">
computed: {
  quotes: function () {
    let vue = this
    //  eslint-disable-next-line
    return new kendo.data.DataSource({
      transport: {
        read: {
          url: this.queryString,
          beforeSend: function (xhr) {
            // xhr.setRequestHeader('Access-Control-Allow-Origin', '*')
            xhr.setRequestHeader('Authorization', Constants.AUTH_KEY)
          },
          type: 'GET',
          dataType: 'json'
        }
      },
      schema: {
        total: function (response) {
          let records = 0
          if (response && response.length > 0) {
            records = response[0].Count
          }
          return records
        }
      },
      pageable: 'true',
      pageSize: 10,
      serverPaging: 'true',
      // testing the change event handler
      change: function (e) {
        // let data = this.data()
      },
      requestStart: function () { vue.loading = true },
      requestEnd: function () { vue.loading = false }
    })
  },
  queryString () {
    var me = this.$store.getters.user
    var agentNumber = me.userName
    var searchURLstring = `${Constants.SEARCH_URL}?AgentNumber=${agentNumber}`
    if (this.currentPolicyNo) {
      searchURLstring += `&QuoteNumber=${this.currentPolicyNo}`
    }
    if (this.currentInsuredName) {
      searchURLstring += `&InsuredName=${this.currentInsuredName}`
    }
    if (this.currentAddr1) {
      searchURLstring += `&Address=${this.currentAddr1}`
    }
    if (this.currentSortField) {
      searchURLstring += `&sortField=${this.currentSortField}`
      searchURLstring += `&sortDirection=${this.currentSortField}`
    }
    searchURLstring += `&SearchScope=${this.searchScope}`
    return searchURLstring
  }
}

7 Answers, 1 is accepted

Sort by
0
Ianko
Telerik team
answered on 20 Nov 2018, 08:19 AM
Hello Brad,

The code used is mixing up both DataSource and Vue utilities and this is why you are experiencing such side effects with the Grid. Dynamically changing the URL of the DataSource is not required in this case. You can use the data option of the transport.read operation in order to add additional query strings. Having a static URL with the data option should fix that, but that depends on the data that is fetched back and how queries are processed. 

If that option does not solve things, I suggest you to prepare a simple, locally runnable example so that I could examine it and have a better idea of what is going on with the setup here. 


Regards,
Ianko
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Brad
Top achievements
Rank 1
answered on 21 Nov 2018, 03:12 AM

Ianko,

Sadly, your recommendation yields the exact same behavior.  The first page displays correctly; subsequent pages receive the data but do not refresh the grid.  I have a project file I can share with you, but don't want to post it publicly.   Can you send me an email at the email in my profile? I'll reply with the project file.

 

Thanks,
Schulz

0
Brad
Top achievements
Rank 1
answered on 21 Nov 2018, 03:19 AM
I opened support ticket 1362184 and attached the project file there.
0
Ianko
Telerik team
answered on 21 Nov 2018, 05:57 AM
Hi Brad,

We are going to look at this in the opened ticket. Thanks.

Regards,
Ianko
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Aleksei
Top achievements
Rank 1
answered on 02 Mar 2020, 02:56 PM

Hello,

I have the same issue. Have the problem been resolved?

Thank you in advance!

0
Ianko
Telerik team
answered on 04 Mar 2020, 07:18 AM

Hi Aleksei,

The problem was the serverPaging setup. It was set to string value instead of a boolean one. If this is not the case on your end, you can open a support ticket with some more details about the setup of the Grid and the difficulties you encounter.

Regards,
Ianko
Progress Telerik

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Aleksei
Top achievements
Rank 1
answered on 04 Mar 2020, 12:24 PM

Hi Ianko,

Thank you, that's exactly what was wrong.

Regards,

Aleksei.

Asked by
Brad
Top achievements
Rank 1
Answers by
Ianko
Telerik team
Brad
Top achievements
Rank 1
Aleksei
Top achievements
Rank 1
Share this question
or