CODEWITHSUNDEEP
w2ui
Delyan Ninov
Delyan Ninov

Reputation: 33

How to configure url request from w2ui onRequest

I am working on a larevel-vue application and I am using w2ui grid library. I want to make infinity scroll, but I am having troubles configuring the grid request. In order to do requests for records I need to send payload data to static like this:

 axios.post("/api-gateway", {name: "objects", payload});

This is how it is done with axios and I was trying to configure w2ui grid similarly, but I can't remove the request query from the url and add the payload data. Basically what I am doing is adding the url to the grid and then in the onRequest method editing the details of the event like this:

onRequest:(event) => {
            event.detail.httpMethod = 'POST';
            let credentials =  {
                name: "objects",
                payload: this.payload
            };
            event.detail.postData = credentials;
        }

This is all good, but it results into a request query in the URL like this:

http://mysite.test/api-gateway?request=.........

I would like to remove this query and only add payload data to the request, is this possible?

Upvotes: 0

Views: 202

Answers (2)

marc
marc

Reputation: 309

You can set the request dataType for your grid (or globally for your app) to a dataType that matches your api. The available data types are listed here

To set the dataType just for your grid (for example using dataType RESTFULLJSON):

my_grid {
  name: 'data_grid',
  dataType: 'RESTFULLJSON',
    :

To set the dataType globally, you can set it in start.js:

import w2utils from '../w2ui.es6.min.js'  // or whatever version you're using

w2utils.settings.dataType = 'RESTFULLJSON' // before router.init()

Upvotes: 0

Delyan Ninov
Delyan Ninov

Reputation: 33

I managed to fix my problems by using dataType property when creating my grid. The type that I used was JSON.

dataType: 'JSON',

After this the onRequest looks like this:

onRequest:(event) => {
            event.detail.httpMethod = 'POST';
            event.detail.postData = {name: "objects", payload: this.payload};
            event.detail.httpHeaders = {
                'X-Xsrf-Token': this.$cookies.get('XSRF-TOKEN'),
            };

Upvotes: 0

Related Questions