На мой взгляд, мне нужно восстановить пользователей после их состояния. (это представление twig, я работаю над проектом symfony, но здесь уже построен фоновый процесс)пустой предыдущий контент div, чтобы заменить его другим, используя ajax
Вид содержит 3 кнопки (теги точно) и таблицу. Фактически, это похоже на создание фильтра для отображения пользователей в таблице, следующих за их состоянием.
3 состояния:
- ждет проверки =>
pending_validation - включен
- отключил
Это мой код на мой взгляд HTML:
{# the div containing the menu #}
<div>
<ul class="nav navbar-nav navbar-right nav nav-pills link-right">
<li class="active getState" id="enabled">
<a href="#enabled">
<b>User enabled</b>
</a>
</li>
<li class="getState" id="disabled">
<a href="#disabled">
<b>User disabled</b>
</a>
</li>
<li class="getState" id="pending_validation">
<a href="#pending_validation">
<b>User attempting validation</b>
</a>
</li>
</ul>
</div>
{# the div containing the table of user #}
<div id="userInfo">
{% if (users|length == 0) %}
<p> <i>No users are availabled for the choosen statement you click on !</i></p>
{% else %}
<table class="table table-condensed">
<thead>
<tr>
<th>
USERS
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div>
<table class="table table-striped">
<tbody>
{% for user in users %}
<tr>
<td>
<b>{{ user.id }}</b>
</td>
<td>
<b>{{ user.username }}</b>
</td>
<td>
<b>{{ user.email }}</b>
</td>
<td>
{{ user.created_at|date}}
</td>
<td>
</td>
<td>
<a href="{{path('edit', { 'slug': user.slug })}}">
<button>
EDIT
</button>
</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</div>
, как вы можете понять, когда администратор нажимает кнопку, я должен отобразить таблицу правильных пользователей с правильным состоянием в Javascript, используя jQuery.
Я написал этот код в JavaScript с помощью JQuery:
<script type="text/javascript" charset="utf-8" defer>
$('.getState').bind('click', function(){
var userInfoDiv = $('#userInfo');
$('.active').removeClass("active");
$(this).addClass("active");
$.ajax({
type: "GET",
cache: false,
url: "{{ path('index_user_admin') }}",
data: {
state: $(this).attr("id")
},
success: function(html){
userInfoDiv.html('');
var newuserInfoDiv = $(html).find('#userInfo');
userInfoDiv.replaceWith(newuserInfoDiv);
userInfoDiv = newuserInfoDiv;
}
});
});
</script>
Как вы можете понять, параметр URL моего AJAX запроса является url: "{{ path('index_user_admin') }}" и Retuns всего вида HTML, содержащего меню DIV и таблицу.
Запрос ajax хорошо работает, я восстанавливаю информацию о моих пользователях. За исключением одной вещи, и я действительно не знаю, как исправить это поведение.
Как только я нажал на кнопку, она загружает и отображает мои пользовательские данные, но она добавляет ее и не восстанавливает фактическое, что я хочу заменить новыми, которые я вызываю при нажатии.
Что я хотел бы сделать здесь, это заменить фактический контент новым контентом, который я вызываю, когда я нажал на кнопку. На данный момент мои предыдущие данные должны быть удалены для замены новой информацией о пользователях, это не так, на самом деле данные не удаляются, а новые данные добавляются к предыдущим.