Forum

Thread tagged as: Question

Edit a Table in Perch

Hi, I'm using Twitter Bootstrap and just purchased Perch and started coding up my site. I'm not sure how to do tables in Perch though. Is it possible?

It's a small table that I need to be user editable.
Guy T

Guy T 0 points

  • 3 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

Yes, absolutely. What editing experience are you trying to achieve? There's lots of ways you can do it.
Guy T

Guy T 0 points

3 years ago

Great. The tables should remain a fixed size so I don't (think I'll) need users to be able to remove/add columns/rows. I'd like the ability to edit column headings <th> and the <td> table data. Keep it simple for now. Maybe I'd want to edit row headings as well but that's a low priority.
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

Using a repeater might be a good way to go.

https://docs.grabaperch.com/video/v3/perch-repeaters/
Andy Knight

Andy Knight 1 points

3 years ago

Hi Guy,

You could try something likes this which uses the repeater method that Drew mentioned, this way you can add rows. I included the Bootstrap table classes "table-responsive" and "table table-striped" so change as you see fit.

<div class="table-responsive">
  <table class="table table-striped">
    <thead>
      <tr>
        <th><perch:content id="header_row_a" type="text" label="A" divider-before="Header Rows" /></th>
        <th><perch:content id="header_row_b" type="text" label="B" /></th>
        <th><perch:content id="header_row_c" type="text" label="C" /></th>
      </tr>
    </thead>
    <tbody>
      <perch:repeater id="table_data" label="Table Data">
      <tr>
        <td><perch:content id="col_a" type="text" label="A" /></td>
        <td><perch:content id="col_b" type="text" label="B" /></td>
        <td><perch:content id="col_c" type="text" label="C" /></td>
      </tr>
      </perch:repeater>
    </tbody>
  </table>
</div>
Guy T

Guy T 0 points

3 years ago

Thanks guys. I'm trying to get this into my page and I'm falling at the first hurdle. How do I code it as content to be edited, a region on the page I guess? Just doing <?php perch_content('table'); ?> doesn't work of course.

I'm missing something fundamental her but, I don't know what.
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

That code should create a new region once you've loaded your page in a browser.

You then need to pick a template for that region to use. These are all based in /perch/templates. You can create a new one with your repeater code, and then pick that.

If these concepts are still a bit uncomfortable, perhaps watch the Getting Started video tutorial.