<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<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/qfq-bs.css">
<title>Type Ahead</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>save_no_redirect.json</option>
<option>save_server_redirect.json</option>
<option>save_client_redirect.json</option>
</select>
</label>
<label>Delete URL
<select name="deleteUrl" id="deleteUrl">
<option>404 error</option>
<option>delete_client_redirect.json</option>
<option>delete_error.json</option>
<option>delete_no_redirect.json</option>
<option>delete_server_redirect.json</option>
</select>
</label>
<label>Upload to
<select name="uploadTo" id="uploadTo">
<option>404 error</option>
<option>uploadhandler.php</option>
<option>uploadhandler_error.php</option>
</select>
</label>
<label>File Delete Url
<select name="fileDeleteUrl" id="fileDeleteUrl">
<option>404 error</option>
<option>delete_file_ok.json</option>
<option>delete_file_error.json</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-12 ">
<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">
<div id="formgroup1" class="form-group">
<div class="col-md-2">
<label for="dropdown1" class="control-label">Text input</label>
</div>
<div class="col-md-6">
<input id="dropdown1" type="text" class="form-control qfq-type-ahead" name="dropdown1"
data-sip="abcde" data-template="template1">
</div>
</div>
<div id="formgroup2" class="form-group">
<div class="col-md-2">
<label for="dropdown2" class="control-label">Text input 2</label>
</div>
<div class="col-md-6">
<input id="dropdown2" type="text" class="form-control qfq-type-ahead" name="dropdown2"
data-sip="abcdef">
</div>
</div>
</form>
</div>
<script type="text/x-handlebars-template">
</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/EventEmitter.min.js"></script>
<script src="../js/typeahead.bundle.min.js"></script>
<script src="../js/qfq.debug.js"></script>
<script type="text/javascript">
$(function () {
var qfqPage = new QfqNS.QfqPage({
tabsId: 'myTabs',
formId: 'myForm',
submitTo: 'api/' + $("#submitTo").val(),
deleteUrl: 'api/' + $("#deleteUrl").val(),
fileUploadTo: 'api/' + $("#uploadTo").val(),
fileDeleteUrl: 'api/' + $("#fileDeleteUrl").val(),
typeAheadUrl: 'api/typeahead.php'
});
$("#submitTo").on("change", function (evt) {
qfqPage.settings.submitTo = 'api/' + $(evt.target).val();
qfqPage.qfqForm.submitTo = 'api/' + $(evt.target).val();
});
$("#deleteUrl").on("change", function (evt) {
qfqPage.settings.deleteUrl = 'api/' + $(evt.target).val();
qfqPage.qfqForm.deleteUrl = 'api/' + $(evt.target).val();
});
$("#uploadTo").on("change", function (evt) {
qfqPage.settings.fileUploadTo = 'api/' + $(evt.target).val();
qfqPage.qfqForm.fileUploader.targetUrl = 'api/' + $(evt.target).val();
});
$("#fileDeleteUrl").on("change", function (evt) {
qfqPage.settings.fileDeleteUrl = 'api/' + $(evt.target).val();
qfqPage.qfqForm.fileDeleter.targetUrl = 'api/' + $(evt.target).val();
});
$('#myForm').on('invalid', function () {
console.log("Invalid event catched");
});
QfqNS.Log.level = 0;
});
</script>
</body>
</html>