How can I generate multiple pairs of a number field and a checkbox? (checkbox disables one number field)

Question

I'm trying to generate multiple pairs of a number form and a checkbox.

Clicking the checkbox disables the number field , The problem is that only the first pair is working. Can someone help me?

here's my code: addHRGrade.blade.php

@extends('layouts.default')

@section('content')

<!-- opening the form -->
        {{ Form::open(array('url' => 'students/create', 'method' => 'PUT')) }}

        @foreach($students as $stud)
            <ul>
                <li>
                    <!-- Printing the students retrieved from the dataabase -->
                    {{  $stud->LName. " , " .$stud->FName }}
                    <!-- Making a text field for every students -->
                    <div ng-app="" >
                        <input name="grade" id="no_grade" type="checkbox" value="0" ng-model="checked" />
                        <label>No Grade</label>
                        <input name="grade" id="num_grade" type="number" value="65" ng-model="number" ng-disabled="checked"/>
                    </div>  
                </li>   
            </ul>
        @endforeach

        <!-- Save button -->
        <p> {{Form::submit('Save')}} </p>
        <!-- Closing the form -->
        {{ Form::close() }}

@stop

Answer 1

Main issue

You're declaring one ng-app="" per table row. I don't think that's what you want to do. You should wrap everything into a single app. Also, you don't assign anything to ngApp and also ngController so your not able to implement any further logic.

Side issues

When you fixed the main issue, you'll see, that every checkbox and textbox will display the same value, since you assign the same model to each checkbox resp. textbox.

The value="65" won't do anything. You want to display the models data, so the models data (which is undefined at startup). To set the initial value use ng-init="number=65" .