<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/bootstrap-theme.min.css">
<link rel="stylesheet" href="../css/jqx.base.css">
<link rel="stylesheet" href="../css/jqx.bootstrap.css">
<link rel="stylesheet" href="../css/qfq-bs.css">
<title>Dirty Form Mock</title>
</head>
<body>
<label>Submit to
<select name="submitTo" id="submitTo">
<option>404 error</option>
<option>save_error_matno.json</option>
<option>save_error_geburtstag.json</option>
<option id="option-save-no-redirect">save_no_redirect.json</option>
<option>save_server_redirect.json</option>
<option>save_client_redirect.json</option>
<option id="option-save-conflict">save_conflict.json</option>
<option id="option-save-conflict-allow-force">save_conflict_allow_force.json</option>
</select>
</label>
<label>Dirty
<select name="dirtyUrl" id="dirtyUrl">
<option id="option-404error">404 error</option>
<option id="option-dirty-success">lock_success.php</option>
<option id="option-dirty-success-with-timeout">lock_success_with_timeout.php</option>
<option id="option-dirty-denied">lock_denied.php</option>
<option>lock_error.php</option>
</select>
</label>
<div class="container-fluid">
<div class="row hidden-xs">
<div class="col-md-12">
<h1>Title with a long text</h1>
</div>
</div>
<div class="row">
<div class="col-md-10">
<ul id="myTabs" class="nav nav-pills" role="tablist">
<li role="presentation" class="active"><a href="#person" data-toggle="tab">Person</a></li>
<li role="presentation"><a href="#person2" data-toggle="tab">Person2</a></li>
<li role="presentation"><a href="#funktion" data-toggle="tab">Funktion</a></li>
<li role="presentation"><a href="#adresse" data-toggle="tab">Adresse</a></li>
<li role="presentation"><a href="#display" data-toggle="tab">Display</a></li>
<li role="presentation"><a href="#settings" data-toggle="tab">Settings</a></li>
<li role="presentation" class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button">
more <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#arbeitsgruppe" data-toggle="tab">Arbeitsgruppe</a></li>
<li><a href="#publikation" data-toggle="tab">Publikation</a></li>
<li><a href="#privilegien" data-toggle="tab">Privilegien</a></li>
<li><a href="#technical" data-toggle="tab">Technical</a></li>
<li><a href="#notes" data-toggle="tab">Notes</a></li>
<li><a href="#referenzen" data-toggle="tab">Referenzen: Read Only</a></li>
</ul>
</li>
</ul>
</div>
<div class="col-md-2 ">
<div class="btn-toolbar pull-right" role="toolbar">
<div class="btn-group" role="group">
<button id="save-button" type="button" class="btn btn-default navbar-btn"
data-class-on-change="wdc"><span
class="glyphicon glyphicon-ok"></span></button>
<button id="close-button" type="button" class="btn btn-default navbar-btn"><span
class="glyphicon glyphicon-remove"></span></button>
</div>
<div class="btn-group" role="group">
<button id="delete-button" type="button" class="btn btn-default navbar-btn"><span
class="glyphicon glyphicon-trash"></span></button>
</div>
<div class="btn-group" role="group">
<a id="form-new-button" href="personmock.html?s=badcaffe1" class="btn btn-default navbar-btn"><span
class="glyphicon glyphicon-plus"></span></a>
</div>
</div>
</div>
</div>
<form id="myForm" class="form-horizontal" data-toggle="validator" data-enable-save-button="false"
data-disable-return-key-submit="false">
<input type="hidden" name="s" value="badcaffee1234">
<div class="tab-content">
<!--pill: Person-->
<div role="tabpanel" class="tab-pane active" id="person">
<div class="form-group">
<div class="col-md-2">
<label for="id" class="control-label">id</label>
</div>
<div class="col-md-6 ">
<p id="id" type="text" class="form-control-static">12345678</p>
</div>
</div>
<div class="form-group">
<div class="col-md-2">
<label for="name" class="control-label">Name</label>
</div>
<div class="col-md-6">
<input id="name" name="name" type="text" class="form-control">
</div>
</div>
<div class="form-group">
<div class="col-md-2">
<label for="firstname" class="control-label">Vorname</label>
</div>
<div class="col-md-6">
<input id="firstname" name="firstname" type="text" class="form-control" required>
<div class="help-block with-errors hidden"></div>
</div>
</div>
</div>
<!--Pill: Person2-->
<div role="tabpanel" class="tab-pane" id="person2">
<div class="form-group">
<div class="col-md-2">
<label for="personMat" class="control-label">Matrikelnummer</label>
</div>
<div class="col-md-6">
<input id="personMat" type="text" class="form-control" name="matno">
</div>
<div class=" col-md-4">
<p class="help-block">Format: xxxxxxxx. Die von der Uni/ETH vergebenen Matrikelnummer.
Wichtig bei Studenten.</p>
</div>
</div>
</div>
<!--pill: Funktion-->
<div role="tabpanel" class="tab-pane" id="funktion">
<!--Persönliche Funktion (subrecord)-->
<div class="form-group">
<div class="col-md-12">
<b>title subrecord_pers_funktion</b>
<div id="subrecord_pers_funktion">
</div>
</div>
</div>
</div>
<!--pill: Adresse-->
<div role="tabpanel" class="tab-pane" id="adresse">
<div class="form-group">
<div class="col-md-2">
<label for="personRaum" class="control-label">Raum</label>
</div>
<div class="col-md-6">
<select id="personRaum" class="form-control">
<option>Raum</option>
<option>Raum</option>
<option>Raum</option>
<option>Raum</option>
<option>Raum</option>
<option>Raum</option>
<option>Raum</option>
<option>Raum</option>
<option>Raum</option>
</select>
</div>
<div class=" col-md-4">
<p class="help-block"></p>
</div>
</div>
</div>
<!--pill: Display-->
<div role="tabpanel" class="tab-pane" id="display">
<div class="form-group">
<div class="col-md-2">
<label for="personHompage" class="control-label">Hompage</label>
</div>
<div class="col-md-6">
<input id="personHompage" type="text" class="form-control">
</div>
<div class=" col-md-4">
<p class="help-block">Alternative zur default 'Persoenlichen Homepage'. Falls kein Link auf
eine Homepage gesetzt werden soll: <b>no_homepage</b></p>
</div>
</div>
</div>
<!--pill: Settings-->
<div role="tabpanel" class="tab-pane" id="settings">
<div class="form-group">
<div class="col-md-2">
<b class="control-label">
Zeige Bild auf Homepage
</b>
</div>
<div class="col-md-6">
<div class="checkbox">
<label>
<input type="checkbox">
</label>
</div>
</div>
<div class=" col-md-4">
<p class="help-block">Feld 'Bild' muss auf ein Bild verweisen.</p>
</div>
</div>
</div>
<!--pill: Arbeitsgruppe-->
<div role="tabpanel" class="tab-pane" id="arbeitsgruppe">
<div class="form-group">
<div class="col-md-2">
<label for="fileupload" class="control-label">File upload</label>
</div>
<div class="col-md-6">
<div class="col-md-6">
<div class="uploaded-file "><span class="uploaded-file-name">john.doe.png</span>
<button class="delete-file" data-sip="filedeletesip"
name="trash-picture:1" type="button"><span
class="glyphicon glyphicon-trash"></span></button>
</div>
<input id="fileupload" name="picture:1" disabled="disabled" class="hidden" type="file"
data-sip="fileuploadsip">
<div class="help-block with-errors"></div>
</div>
</div>
<div class=" col-md-4">
<p class="help-block"></p>
</div>
</div>
</div>
<!--pill: Publikation-->
<div role="tabpanel" class="tab-pane" id="publikation">
<!--Publikation(subrecord)-->
<!--Dissertation / Verteidigung(subrecord)-->
<!--Hauptthemen Publikationen(subrecord)-->
</div>
<!--pill: Privilegien-->
<div role="tabpanel" class="tab-pane" id="privilegien">
<!--Administration von Gaesten fuer: (subrecord)-->
</div>
<!--pill: Technical-->
<div role="tabpanel" class="tab-pane" id="technical">
<div class="form-group">
<div class="col-md-2">
<label for="personAngelegt" class="control-label">Angelegt</label>
</div>
<div class="col-md-6">
<input id="personAngelegt" type="text" class="form-control">
</div>
</div>
</div>
<!--pill: Notes-->
<div role="tabpanel" class="tab-pane" id="notes">
<!--Administrative Notizen zur Person (subrecord)-->
</div>
<!--pill: Referenzen-->
<div role="tabpanel" class="tab-pane" id="referenzen">
<!--Homepage Notizen (subrecord)-->
<!--Organisator: Seminar (subrecord)-->
<!--Organisator: Konferenz (subrecord)-->
<!--Sprecher: Konferenz (subrecord)-->
<!--Sprecher: Seminar (subrecord)-->
<!--Dozent: Vorlesung (subrecord)-->
<!--Uebungsleiter: Vorlesung (subrecord)-->
<!--Gast (subrecord)-->
<!--Student einer Vorlesung (subrecord)-->
<!--Student eines Seminars /Kolloquiums (subrecord)-->
<!--Einladung schriftliche Pruefung (subrecord)-->
<!--Webbox (subrecord)-->
<!--Notizen zu Workflows (subrecord)-->
<!--Konferenzteilnehmer (subrecord)-->
<!--Workflow (subrecord)-->
</div>
</div>
<input type="hidden" name="recordHashMd5" value="mock-hash"/>
</form>
<a href="https://www.google.ch">away</a>
</div>
<script type="application/jqw-combobox-source" id="combobox1_source">
[
{ "value": 1, "text": "item 1" },
{ "value": 2, "text": "item 2" },
{ "value": 3, "text": "item 3" }
]
</script>
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/validator.min.js"></script>
<script src="../js/jqx-all.js"></script>
<script src="../js/globalize.js"></script>
<script src="../js/tinymce.min.js"></script>
<script src="../js/EventEmitter.min.js"></script>
<script src="../js/qfq.debug.js"></script>
<script type="text/javascript">
// Do not remove, or selenium tests will fail.
QfqNS.QfqPage.prototype.beforeUnloadHandler = function (evt) {
// intentionally empty
};
// Default is 60, which is a pain when testing.
QfqNS.Dirty.MINIMUM_TIMER_DELAY_IN_SECONDS = 1;
$(function () {
var qfqPage = new QfqNS.QfqPage({
tabsId: 'myTabs',
formId: 'myForm',
submitTo: 'api/' + $("#submitTo").val(),
dirtyUrl: 'api/' + $("#dirtyUrl").val(),
});
$("#submitTo").on("change", function (evt) {
qfqPage.settings.submitTo = 'api/' + $(evt.target).val();
qfqPage.qfqForm.submitTo = 'api/' + $(evt.target).val();
});
$("#dirtyUrl").on("change", function (evt) {
qfqPage.settings.dirtyUrl = 'api/' + $(evt.target).val();
qfqPage.qfqForm.dirtyUrl = 'api/' + $(evt.target).val();
qfqPage.qfqForm.dirty.dirtyUrl = 'api/' + $(evt.target).val();
});
$('#myForm').on('invalid', function () {
console.log("Invalid event catched");
});
QfqNS.Log.level = 0;
});
</script>
</body>
</html>