Designer crashes when running specific script

OL Connect Professional Designer
1

Hi,

My designer crashes when running a specific script.

This is my page content:

@InvoiceTable@

This is the script that crashes the designer

Name: Invoice Table
Find text: @InvoiceTable@

var table = loadhtml('Snippets/Fragments/invoice-table.html');
var tableRow;

var details = record.tables.item;
for(var i = 0, l = details.length; i < l; i++){
    tableRow = query('tbody tr', table).clone();
    query('tbody', table).append(tableRow);
}

results.html(table);

This is the content of the Snippet loaded in the script (‘Snippets/Fragments/invoice-table.html’):

<table id="table_items" class="table-grid" data-detail="item" style="width:100%;" title="item">
    <thead>
        <tr>
            <td class="ItemNumber">ItemNumber</td> 
            <td class="ItemDescription">ItemDescription</td> 
            <td class="ItemUnitPrice">ItemUnitPrice</td> 
            <td class="ItemOrdered">ItemOrdered</td> 
            <td class="ItemShipped">ItemShipped</td> 
            <td class="ItemBackOrder">ItemBackOrder</td> 
            <td class="ItemTotal">ItemTotal</td> 
        </tr>
    </thead>
    <tbody>
        <tr>
            <td class="data ItemNumber">@ItemNumber@</td> 
            <td class="data ItemDescription">@ItemDescription@</td> 
            <td class="data ItemUnitPrice">@ItemUnitPrice@</td> 
            <td class="data ItemOrdered">@ItemOrdered@</td> 
            <td class="data ItemShipped">@ItemShipped@</td> 
            <td class="data ItemBackOrder">@ItemBackOrder@</td> 
            <td class="data ItemTotal">@ItemTotal@</td> 
        </tr>
    </tbody>
</table>

Is there something wrong with my script? I got parts of it from the user guide located here: PlanetPress® Connect 1.3 User Guide - clone()

Kind Regards,

Sven Slijkoord

2

I have found the solution.

I have modified my code to look like this:

var table = loadhtml('Snippets/Fragments/invoice-table.html');
var tableRow = query('tbody tr', table).clone();

var details = record.tables.item;
for(var i = 1, l = details.length; i < l; i++){
    tableRow = tableRow.clone();
    query('tbody', table).append(tableRow);
}

results.html(table);

The problem was that I was querying ‘tbody tr’ inside the loop, while adding a tr in the loop so I think it was trying to query the added tr’s also, thus creating millions of rows.

After I moved the clone outside of the loop I was only getting 2 rows, weird. Then I cloned the variable (not the query) inside the loop and is was working correctly.

Kind Regards,

Sven Slijkoord

3

Hi, glad you solved it yourself - just a few notes:

In your solution the clone call outside the loop is unnecessary, you only need to clone inside the loop.

If you clone outside the loop and not inside the loop you will get two rows, because what you pass to the append function is not copied, it’s moved. So the first iteration of the loop adds your clone, but with each subsequent iteration the same clone is removed and then added again.

4

Yes, you are right. Thank you for your insight!