Я динамически заменяю свой контент div новым контентом. Мой новый контент - это запись, извлеченная из базы данных, которая хранится в виде списка в переменных данных. Каждый раз, когда нажимается кнопка «Отправить», содержимое должно заменяться следующим элементом в списке. Я объявил глобальную переменную I для извлечения соответствующего элемента из data [] и пытаюсь увеличить свой i. Но каждый раз, когда я инициализируется в исходное значение. Пожалуйста помоги. Я прикрепил свой код здесь.
<html>
<head>
{% set i=0%}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
function ReplaceContentInContainer(id, content) {
var container = document.getElementById(id);
container.innerHTML = "";
container.innerHTML = document.getElementById('blockOfStuff').innerHTML;
}
</script>
<script id="blockOfStuff" type="text/html">
<div id="d1">
{% set i=i+1%} {% for item in data[i]%}
<tr>
{{item}}
</tr>
<br> {% endfor %}
<input type="submit" onclick="javascript:ReplaceContentInContainer('d1','')">
</div>
</script>
</head>
<body>
<div id="d1">
{% for item in data %}
<tr>
{% for val in item %}
<td>{{val}}</td>
<br> {% endfor %}
</tr>
<br>
<input type="submit" onclick="javascript:ReplaceContentInContainer('d1','')"> {% break %} {% endfor %}
</div>
</body>
</html>