IP address list demo


Legg til og fjern avdelinger og ipadresser i listen under.

Grupper

IP Enhet Beskrivelse Notat
<nav class="pull-right">
    <button data-action="add" class="btn-lg" data-target="Adresseomraader">Legg til adresseomr&aring;de</button>
</nav>

<p>Legg til og fjern avdelinger og ipadresser i listen under.</p>

<h2>Grupper</h2>

<div data-array="Adresseomraader">
    <div class="panel panel-default">
        <div class="panel-heading">
            <table class="layout">
                <tr>
                    <td style="width:auto">
                        <input type="text" class="input-lg" name="Gruppenavn" placeholder="Oppgi navn p&aring; gruppe" />
                    </td>
                    <td class="btn-group-lg" style="width:5%;white-space: nowrap">
                        <button data-action="delete">Slett adresseomr&aring;de</button>
                        <button data-action="add" data-target="Adresser">Legg til adresse</button>
                        <button data-action="sort"></button>
                        <span data-toggle="buttons">
                            <label class="btn btn-default btn-lg active">
                                <input type="checkbox" checked="checked" name="Expand" data-func="collapse" data-container=".panel" data-body=".panel-body" />
                                <span class="glyphicon glyphicon-plus"></span>
                            </label>
                        </span>
                    </td>
                </tr>
            </table>
            <div data-columns="4" data-labels="above">
                <input type="text" name="Subnetmask" />
                <input type="text" name="Gateway" />
                <input type="text" name="DNS1" />
                <input type="text" name="DNS2" />
            </div>
        </div>
        <div class="panel-body">
            <label>Beskrivelse</label>
            <textarea data-func="autogrow" name="Beskrivelse"></textarea>
            <p></p>
            <div class="table-responsive">
                <table class="table table-bordered table-striped table-condensed">
                    <thead>
                        <tr>
                            <th>IP</th>
                            <th>Enhet</th>
                            <th>Beskrivelse</th>
                            <th>Notat</th>
                            <th></th>
                        </tr>

                    </thead>
                    <tbody data-array="Adresser">
                        <tr>
                            <td data-name="Adresse" data-placeholder="Fyll inn IP adresse" data-func="input"></td>
                            <td data-name="Enhet" data-placeholder="Ikke tilordnet enhet" data-func="input"></td>
                            <td data-name="Beskrivelse" data-placeholder="Beskrivelse" data-func="input"></td>
                            <td data-name="Notat" data-placeholder="Notat" data-func="input"></td>
                            <th>
                                <a class="btn btn-default btn-sm" data-action="remove"></a>
                                <a class="btn btn-default btn-sm" data-action="sort"></a>
                            </th>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
tbody th {
    white-space:nowrap;
}
No JS code used for this example

Output templates

Templates used for document and web page generation:

Friendly Name File Name Template
Webversjon #Filename#.html Designer View template