Sequence Number in Bootstrap 4 Table Generator

Wappler General How To
,
#1

We recently have to add a new column (usually at the very left side) that contains the sequence number in a Table in List Page. So please, add the “Sequence Number” option in “Boostrap 4 Table Generator”.

By enabling this option, then end-users are able to identify the current sequence number in a current/active List page in each record.

For example, if the Records per Page is limited to 10 records, in the first page, there will be sequence number from 1 to 10, in the second page, there will be sequence number from 11 to 20, and so forth.

Thank you.

#2

To add a sequence, add a new column with $index+1 as the value. You can select it from the repeat options:

image .

You could add 1 in code view, or visually or with the code editor:

image

#3

Thanks, @TomD. I’ll give it a try.

#4

I have tried your suggestion, but this works only in the first page. In the second page, third page, and so forth, the sequence number does not increase. It is always the same in all pages, from 1 to 10, assume limit (records per page) = 10.

#5

I wouldn’t say it doesn’t work, but I can see it doesn’t give you the result you want. I think this should work as you want:
{{query.offset.toNumber() + $index + 1}}

#6

Unfortunately, the result is still the same. The sequence number in the other page are the same with the sequence number in the first page.

#7

I’ve just added it to a page. I assumed this is what you meant:

sequence
sequence1184×450 3.25 MB

#8

Please try this syntax. Works for me.
{{(query1.data.offset.toNumber() + ($index + 1))}}

My offset is 25.

doortellen
doortellen366×777 86.3 KB

#9

The exact syntax will depend on several factors, but it will be similar in any case. What I’m using in the little demo above is:
{{query.offset.toNumber() + $index + 1}}

The offset will obviously change, but the limit can also be selected by the user and the numbering will reflect this, as in the demo (I added this as @masino.sinaga asked about this in another thread).

#10

Thanks for all your replies. Unfortunately, it still does not work, either.

#11

Hopefully you can see that it’s perfectly possible to make it work and you have enough information now to find the problem.

#12

Really? I don’t think @TomD solved my case.

#13

That is not a real solution, I guess. The second post above is not a real solution.

#14

I found the solution by myself. This is quite different data structure from all the previous replies above. That is why the second post above is not a real solution.

Here is the complete code for my real solution, and this code works properly:

{{(orderslist.data.query_orderslist.offset + $index) + 1))}}

As you can see, there are no toNumber() method in my code. In addition, as you can see from my code, before .offset, there are two dot that separate between orderslist, data, and query_orderslist.

#15

I took a conclusion for this case. Wappler is not consistent for handling the sequence number. There is no standard code for displaying the sequence number for records to be displayed in table. For Wappler beginners, this will make them confused.

That is why this should be handled from Bootstrap 4 Table Generator. Please add this as the option. For those who want to use the sequence number from the built-in function, just enable this option. Otherwise, let this option disabled, and implement your own code by yourself.

#16

It’s very funny to see the following three data structure:

{{query.offset.toNumber() + $index + 1}}

{{(query1.data.offset.toNumber() + ($index + 1))}}

{{(orderslist.data.query_orderslist.offset + $index) + 1))}}

None of the three code above looks consistent.

#17

Perhaps you didn’t see the demo I made, showing the solution working. Of course the solution offered were ‘real solutions’ - they were solutions which suggested by people who are very familiar with Wappler. The solution was basically: offset + $index + 1 - that is the answer you were given and is the solution that you have used.

I’m sure you understand that the exact code will depend on various factors, as I mentioned. I’m sure you also understand that there are often many different ways to do things.

#18

Of course not. Eg you have used the name of a server connect connection ID which you have named. Surely you wouldn’t expect everybody to use the same names as you? In my case, I haven’t included this ID because it’s not necessary and I can easily copy/paste between different pages or projects with having to edit the code.

#19

If this is the basic, Wappler should use this basic code only. If $index can be used in that table, then offset should be used independently as well as $index. Why didn’t use $offset? That is why I mentioned several times above, Wappler is not consistent to provide the data structure to display the sequence number. You have to do trial and error to find out the real solution for your own case.

#20

Regardless developer use server connect connection ID or not, Wappler should provide the simple variable $offset that can be used as well as $index. That’s the point.