Применить php скрипт, в отношении пользователя, которому принадлежит
Доброго времени суток.
У меня на сайте есть список пользователей, который выводится циклом из бд при помощи php, пример:
<div class="user">
<p>Иван</p><button type="button">Редактировать пользователя</button>
</div>
<div class="user">
<p>Олег</p><button type="button">Редактировать пользователя</button>
</div>
<div class="user">
<p>Антон</p><button type="button">Редактировать пользователя</button>
</div>
При нажатии на кнопку "Редактировать пользователя", например, у Антона, нужно чтобы открывалась страница редактирования пользователя, которая в свою очередь, применит внесенные на этой странице изменения только для Антона (И по аналогии с остальными пользователями).
Из идей на данный момент, это цеплять в цикле ссылку на кнопку (во время вывода списка пользователей) с GET параметром идентификатора пользователя и в дальнейшем в скрипте, опираться на этот самый GET. Вот что должно получиться:
<div class="user">
<p>Иван</p><button href="/edituser?user_id=1" type="button">Редактировать пользователя</button>
</div>
<div class="user">
<p>Олег</p><button href="/edituser?user_id=2" type="button">Редактировать пользователя</button>
</div>
<div class="user">
<p>Антон</p><button href="/edituser?user_id=3" type="button">Редактировать пользователя</button>
</div>
Является ли данное решение оптимальным? Или существует другой, более лучший вариант решения данного вопроса.
Ответы (2 шт):
Можно воспользоваться Grid. Здесь по двойному клику на ячейку вы сразу сможете редактировать поле. Попробуйте выполнить скрипт.
ge = new GridEdit({
cols: [{
label: 'ФИО',
valueKey: 'name',
type: 'string'
},
{
label: 'Должность',
valueKey: 'jobTitle',
type: 'string',
style: {
textAlign: 'left'
}
},
{
label: 'Кол-во проектов',
valueKey: 'numProjects',
type: 'number',
editable: false
}
],
rows: [{
name: 'Василий Иванов',
jobTitle: 'Режисер',
numProjects: '1000'
},
{
name: 'Петр Сидоров',
jobTitle: 'Сценарист',
numProjects: '2'
},
{
name: 'Алексей Овальный',
jobTitle: 'Массовка',
numProjects: '2'
}
],
tableClass: 'table table-bordered',
beforeInit: function() {
// console.log('beforeInit');
},
afterInit: function() {
// console.log('afterInit');
},
beforeCellActivate: function(cell) {
if (cell.type === 'date' && cell.editable === true) {
// console.log(cell, 'This is a date field!');
}
if (cell.meta.valueKey === 'notes') {
// cell.element.onclick = function() {
// return false;
// };
}
},
afterCellActivate: function(cell) {
// console.log(cell, 'afterCellActivate');
},
initialize: true
});
table {
max-width: 100%;
}
th {
text-align: left;
}
.table {
width: 100%;
margin-bottom: 20px;
}
.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td {
padding: 8px;
line-height: 1.428571429;
vertical-align: top;
border-top: 1px solid #ddd;
}
.table>thead>tr>th {
vertical-align: bottom;
border-bottom: 2px solid #ddd;
}
.table>caption+thead>tr:first-child>th,
.table>colgroup+thead>tr:first-child>th,
.table>thead:first-child>tr:first-child>th,
.table>caption+thead>tr:first-child>td,
.table>colgroup+thead>tr:first-child>td,
.table>thead:first-child>tr:first-child>td {
border-top: 0;
}
.table>tbody+tbody {
border-top: 2px solid #ddd;
}
.table .table {
background-color: #fff;
}
.table-bordered {
border: 1px solid #ddd;
}
.table-bordered>thead>tr>th,
.table-bordered>tbody>tr>th,
.table-bordered>tfoot>tr>th,
.table-bordered>thead>tr>td,
.table-bordered>tbody>tr>td,
.table-bordered>tfoot>tr>td {
border: 1px solid #ddd;
}
.table-bordered>thead>tr>th,
.table-bordered>thead>tr>td {
border-bottom-width: 2px;
}
#contextMenu {
position: absolute;
}
#contextMenu .disabled {
color: #C0C0C0;
background: none;
}
#contextMenu li a {
cursor: pointer;
}
.active {
background-color: #FFE16F !important;
opacity: 0.6;
}
.uneditable {
background: #FFBBB3 !important;
opacity: 0.6;
}
<script src="https://www.cssscript.com/demo/easy-editable-data-grid-with-vanilla-javascript-gridedit/gridedit.js"></script>
<div id="gridedit"></div>
Подробнее тут: https://www.cssscript.com/easy-editable-data-grid-with-vanilla-javascript-gridedit/
на кнопку ссылку не ставят, попробуйте так
<div class="user">
<p>Иван</p><a href="/edituser?user_id=1" type="button">Редактировать пользователя</a>
</div>
<div class="user">
<p>Олег</p><a href="/edituser?user_id=2" type="button">Редактировать пользователя</a>
</div>
<div class="user">
<p>Антон</p><a href="/edituser?user_id=3" type="button">Редактировать пользователя</a>
</div>
на странице edituser по $_GET['user_id'] достаете всю инфу юсера и редактируете
если надо с кнопками то можно через форму
<form action="/edituser" method="POST">
<div class="user">
<p>Иван</p><button name="тут user_id" type="button">Редактировать пользователя</button>
</div>
<div class="user">
<p>Олег</p><button name="тут user_id" type="button">Редактировать пользователя</button>
</div>
<div class="user">
<p>Антон</p><button name="тут user_id" type="button">Редактировать пользователя</button>
</div>
</form>