JSFiddle - React, Tailwind, and code Playground

by manikandankathirvel

HTML

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="namesCtrl">


        <table id="customers" class="table table-bordered">
            <thead>
                <tr>
              
                    <th>USN</th>
                    <th>Student Name</th>
                    <th>Obt Marks</th>
                    <th>Attendance</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="x in mddata">
                    <td ng-model="contact.usn">{{x.usn}}</td>
                    <td ng-model="contact.name">{{x.name}}</td>
                    <td><input type="text" name="" value="" ng-disabled="isDisabled" ng-model="contact.marks"></td>
                    <td>

					<select ng-model="selectedName" ng-options="item for item in attendance_status" ng-model="contact.attendance">

                    </td>
                </tr>
                

            </tbody>
        </table>
        
                            <input type="button" class="submit_data" value="submit">











</div>

<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {


  $scope.submit = function(data) {
  
  		console.log(JSON.stringify(data));


    };











              $scope.attendance_status = ['Absent','Present']

    $scope.names = ["Emil", "Tobias", "Linus"];

    $scope.mddata = 
    
    [{"usn":"mlx-edc1-44","name":"mlx-student-edc1-44"},{"usn":"mlx-edc1-62","name":"mlx-student-edc1-62"},{"usn":"mlx-edc1-45","name":"mlx-student-edc1-45"},{"usn":"mlx-edc1-46","name":"mlx-student-edc1-46"},{"usn":"mlx-edc1-63","name":"mlx-student-edc1-63"},{"usn":"mlx-edc1-47","name":"mlx-student-edc1-47"}]
    
   
   
   
   
   
   
   
   
   
   
   
   
   
    
});
</script>

</body>
</html>