How to show line number of row (ie: 1, 2, 3, etc)

edited March 2, 2017 in Questions
I am showing a list of opportunities and I'd like to see how many numbers I have like in the example below. How could I do this?


image


Thanks,
Charlie

Comments

  • edited October 20, 2016
    Hello! I just tried this and it works:

    Firstly, create a template field on the table by clicking the 'Add Field(s)' dropdown on the table. You can label the template field anything you want.

    In the template use:
    <span class="counter"></span>
    And make sure 'Allow HTML' is selected.

    Then, add an inline snippet with the following code:
    (function(skuid){   var $ = skuid.$;   $(document.body).one('pageload',function(){    $('.counter').each(function(index, element){        $(this).text(index+1);    });   });  })(skuid);  
    This iterates through each 'counter' element and inserts the number for you.
  • edited October 20, 2016
    This won't work, however, for tables with multiple pages or where you are allowing the user to load more data into the table. That would require a different approach - and probably a better one!
  • edited October 20, 2016
    Thank you Louis. I'll try it out =)
  • edited October 20, 2016
    Also, let me correct, you should be adding an 'in-line' javascript resource, rather than 'in-line (snippet)'
  • edited January 12, 2017
    Hi Charlie

    You could use a custom field renderer on any field (e.g. Record ID) that looks like this
    var field = arguments[0],    value = arguments[1],
    $ = skuid.$;
    var index = 0;
    field.model.data.map(function(o, i){
        if(o === field.row) {
            index = i;
            return;
        }
        return;
    });
    field.element.append(index + 1);
  • edited March 2, 2017
    There is a really simple, declarative approach that requires NO javaScript code: add a Template column to your Table with the following as its template value:

    {{index}}

    image

    image

    This is leveraging the {{index}} row merge variable which is available in row merge contexts.
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!