Pavel Horyna
Pavel Horyna

Reputation: 431

Splitting a html table in a foreach c#

I am trying to generate a html table, and after each 25 rows I want to split it and start a new table. The problem is c# is able to see my html code inside the foreach loop, and regards it as broken code. what is the workaround for this?

@{
    int counter = 1;
    foreach (var collection in Model.Collections)
    {
        if (counter % 25 == 0)
        {
            </tbody></table>
                <table class='table table__next'> 
                  <tbody>
                <tr>
                    <td>37.18.3019</td>
                    <td>c21351900000055</td>
                    <td>nope</td>
                    <td>888ml</td>
                    <td>154.8 g/l</td>
                    <td>165/88</td>
                    <td>189754</td>
                    <td>9999/99 99.99.9999</td>
                </tr>
        } else {
                <tr>
                <td>37.18.3019</td>
                <td>c21351900000055</td>
                <td>nope</td>
                <td>888ml</td>
                <td>154.8 g/l</td>
                <td>165/88</td>
                <td>189754</td>
                <td>9999/99 99.99.9999</td>
            </tr>
        }
            counter++;
    }
}

Current result: https://prnt.sc/pvw1st

Upvotes: 0

Views: 619

Answers (3)

David
David

Reputation: 219096

You can use the @: syntax or a <text> tag to indicate to the Razor engine that this is content to be emitted and not server-side code. For example:

if (counter % 25 == 0)
{
    <text>
        </tbody></table>
        <table class='table table__next'> 
            <tbody>
                <tr>
                    <td>37.18.3019</td>
                    <td>c21351900000055</td>
                    <td>nope</td>
                    <td>888ml</td>
                    <td>154.8 g/l</td>
                    <td>165/88</td>
                    <td>189754</td>
                    <td>9999/99 99.99.9999</td>
                </tr>
    </text>
}

Or:

if (counter % 25 == 0)
{
    @:</tbody></table>
    @:<table class='table table__next'> 
    @:    <tbody>
    @:        <tr>
    @:            <td>37.18.3019</td>
    @:            <td>c21351900000055</td>
    @:            <td>nope</td>
    @:            <td>888ml</td>
    @:            <td>154.8 g/l</td>
    @:            <td>165/88</td>
    @:            <td>189754</td>
    @:            <td>9999/99 99.99.9999</td>
    @:        </tr>
}

(The latter is usually only used for single-line outputs, and the former for larger blocks, but both are shown here for completeness.)

To make use of server-side code within these blocks, you'd use the same @ syntax you use anywhere:

<text>
    <p>This is a server-side value: @myValue</p>
</text>

Upvotes: 0

cbalakus
cbalakus

Reputation: 630

you can use @Html.Raw

<table>
<tbody>       
@{
        int counter = 0;
        foreach (var collection in Model.Collections)
        {
            if (counter % 25 == 0)
            {
                @Html.Raw("</tbody></table><table><tbody>");
            }
            <tr>
                <td>37.18.3019</td>
                <td>c21351900000055</td>
                <td>nope</td>
                <td>888ml</td>
                <td>154.8 g/l</td>
                <td>165/88</td>
                <td>189754</td>
                <td>9999/99 99.99.9999</td>
            </tr>
            counter++;
        }
    }
</tbody>
</table>

Upvotes: 1

Emanuele
Emanuele

Reputation: 888

Try using Html.Raw("</tbody></table>")

With Html.Raw() function you can write any string into the html, without parsing errors.

Upvotes: 2

Related Questions