Hi there! It’s been a while.
So, we had taken some time already evaluating which tool could do the job without having to reinvent any wheels. But the decision fell on trying it ourselves because of our specific needs and getting into php etc.
Modifying / Including the panel did not work as we wished, thinking of keeping it straight for administration-level, kirby-updates and spacial appearance, so the uniform-fight is on the run.
That’s why i want to keep this thread running, if anyone is interested.
Right now, i’m trying to include several forms into one page, which is actually working, but also making me curious. It’s about two different types of forms (fileupload / textchange) which are inside the subpages-loop. so every subpage is displayed and gets it’s referring forms.
i started static and then translated to dynamic, thinking of this previous question. The thing is, in the end it worked without it:
Template:
<?php if($page->hasChildren()):
$id = 0;
foreach($page->Children()->sortBy('date', 'desc') as $protocol):
$id = $id + 1; ?>
<form id="uploadform<?= $id ?>" class="aform" action="<?php echo $page->url() ?>" method="POST" enctype="multipart/form-data">
<input name="filefield" type="file" required/>
<input type="hidden" name="formid" value="fileupload">
<input type="hidden" name="pageuri" value="<?= $protocol->diruri() ?>">
<?php echo csrf_field() ?>
<?php echo honeypot_field() ?>
<input type="submit" value="Submit" class="xyz">
</form>
<form id="textform<?= $id ?>" class="aform" action="<?php echo $page->url() ?>" method="POST">
<input type="hidden" name="formid" value="textchange">
<input type="hidden" name="pageuri" value="<?= $protocol->diruri() ?>">
<?php echo csrf_field() ?>
<?php echo honeypot_field() ?>
<textarea name="ptext" class="markdown" style="height: 200px"></textarea>
<input class="" type="submit" value="save">
</form>
<?php endforeach; endif; ?>
Javascript:
var message = document.getElementById('message');
window.addEventListener('load', function () {
var forms = document.getElementsByClassName('aform');
for (var i = 0; i < forms.length; i++) {
var fields = {};
var form = forms[i];
form.querySelectorAll('[name]').forEach(function (field) {
fields[field.name] = field;
});
var handleError = function (response) {
var errors = [];
for (var key in response) {
if (!response.hasOwnProperty(key)) continue;
if (fields.hasOwnProperty(key)) fields[key].classList.add('error');
Array.prototype.push.apply(errors, response[key]);
}
message.innerHTML = errors.join('<br>');
};
var onload = function (e) {
if (e.target.status === 200) {
message.innerHTML = 'got it!'
} else {
handleError(JSON.parse(e.target.response));
}
};
var submit = function (e) {
e.preventDefault();
var request = new XMLHttpRequest();
request.open('POST', e.target.action);
request.onload = onload;
request.send(new FormData(e.target));
// Remove all 'error' classes of a possible previously failed validation.
for (var key in fields) {
if (!fields.hasOwnProperty(key)) continue;
fields[key].classList.remove('error');
}
};
form.addEventListener('submit', submit);
};
});
Config:
c::set('routes', [[
'pattern' => 'gettoken',
'method' => 'GET',
'action' => function() {
return response::json(['token' => csrf()]);
},
]]);
c::set('cache.ignore', ['gettoken']);
c::set('routes', array(
array(
'pattern' => 'you',
'method' => 'POST',
'action' => function() {
$textform = new \Uniform\Form([
'ptext' => [
'rules' => ['required'],
'message' => ['input required']
],
], 'textform');
$uploadform = new \Uniform\Form([
'filefield' => [
'rules' => [
'required',
'file',
'mime' => ['application/pdf'],
'filesize' => 5000,
],
'message' => [
'choose files',
'choose files',
'pdf only',
'smaller than 5mb',
],
]
], 'uploadform');
$pageuri = get('pageuri');
$page = page($pageuri);
$target = $page->root();
if(get('formid') === 'textchange') {
$textform->withoutFlashing()
->withoutRedirect()
->guard();
if (!$textform->success()) {
// Return validation errors.
return response::json($textform->errors(), 400);
};
$textform->ChangeTextAction(['page' => $page]);
if (!$textform->success()) {
// This should not happen and is our fault.
return response::json($textform->errors(), 500);
};
// Return code 200 on success.
} elseif(get('formid') === 'fileupload') {
$uploadform->withoutFlashing()
->withoutRedirect()
->guard();
if (!$uploadform->success()) {
// Return validation errors.
return response::json($uploadform->errors(), 400);
};
$uploadform->uploadAction(['fields' => [
'filefield' => [
'target' => $target,
'prefix' => false,
],
]]);
if (!$uploadform->success()) {
// This should not happen and is our fault.
return response::json($uploadform->errors(), 500);
};
// Return code 200 on success.
};
}
)
));
Yesterday it threw a json-error yet doing its job, today it works fine (except in Safari, which loads the page without content on redirect). So i think i didn’t get as lucky as i thought and the problem is with the tokens? (referring again to the link above – i could use some help there)
I really appreciate your help, thank you!