{% for i in data %}
<tr id="{{ i.id }}" style="background-color: #d0dee9;text-align: center">
    <td id="sr{{ i.id }}"></td>

    <td>{{ i.year }}</td>
    <td>{{ i.std_name }}</td>
    <td>{{ i.class_name }}</td>
    <td>{{ i.G_r_no }}</td>
    <td>{{ i.present_day }}</td>
    <td>{{ i.roll_no }}</td>
    <td style="white-space: nowrap">{{ i.name }}</td>
    <td>{{ i.gender }}</td>
    <td>{{ i.caste }}</td>
    <td style="white-space: nowrap">{{ i.address }}</td>
    <td style="white-space: nowrap">{{ i.dob }}</td> 
    <td>{{ i.mobile_no }}</td>
    <td class="action_col_data" style="float: none;text-align: center;width: 70px">
        <a class="a-inside edit" id="{{ i.id }}" style="padding-right: 30px">
            <i class="fas fa-edit" title="Edit"> </i>
        </a>
        <a class="a-inside delete_set_id" data-toggle="modal" data-target="#myModal" id="{{ i.id }}">
            <i class="far fa-window-close" title="Delete"> </i>
        </a>
    </td>
</tr>
<script type="text/javascript">
    document.getElementById("sr{{ i.id }}").innerHTML = sr;
    var sr = sr + 1;
</script>
{% endfor %}
<script type="text/javascript">
            var sr = 1;
        </script>