JSFiddle - React, Tailwind, and code Playground

by mantisimo

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<div ng-app="app" ng-controller="bookController">
    <form name="myForm" ng-submit="submitMe(this)" novalidate>
        <table class="table">
            <tr ng-repeat="order in orders">
                <ng-form name="innerForm">
                <td>{{ order.id }}</td>
                <td>
                    <div class="form-group" data-ng-class="{ 'has-error' : innerForm.name.$invalid && submitted }">
                        <input type="input" ng-model="order.name" name="name" required />
                    </div>
                </td>
                </ng-form>
            </tr>
        </table>
        <input type="submit" value="submit" ng-click="submitted = true" />
    </form>
    
    <pre>
        {{ orders | json }}
    </pre>

</div>

JavaScript

var app = angular.module("app", []);

app.controller("bookController", function ($scope) {

    $scope.submitMe = function(form) {
        console.log(form);
    };
    
    $scope.orders = [{
        id: 1,
        name: ''
    }, {
        id: 2,
        name: 'hat'
    }];

});