diff --git a/gemeinsamforschen/src/main/webapp/pages/view_groupfinding_docent.html b/gemeinsamforschen/src/main/webapp/pages/view_groupfinding_docent.html
new file mode 100644
index 0000000000000000000000000000000000000000..01225dc7b74e05399248ef590cc084551b96da86
--- /dev/null
+++ b/gemeinsamforschen/src/main/webapp/pages/view_groupfinding_docent.html
@@ -0,0 +1,72 @@
+<html>
+<head>
+ <title>jQuery select a radio button example</title>
+
+ <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
+
+</head>
+
+<body>
+
+<h1>Gruppenfindung </h1>
+
+<script type="text/javascript">
+
+ $(document).ready(function(){
+
+ $("#isSelect").click(function () {
+
+ alert($('input:radio[name=groupfinding]:checked').val());
+
+ });
+
+ $("#selectMale").click(function () {
+
+ $('input:radio[name=groupfinding]:nth(0)').attr('checked',true);
+ //$('input:radio[name=groupfinding]')[0].checked = true;
+
+ });
+
+ $("#selectFemale").click(function () {
+
+ $('input:radio[name=groupfinding]:nth(1)').attr('checked',true);
+ //$('input:radio[name=groupfinding]')[1].checked = true;
+
+ });
+
+ $("#selectUnknown").click(function () {
+
+ $('input:radio[name=groupfinding]:nth(2)').attr('checked',true);
+ //$('input:radio[name=groupfinding]')[2].checked = true;
+
+ });
+
+ $("#reset").click(function () {
+
+ $('input:radio[name=groupfinding]').attr('checked',false);
+
+ });
+
+ });
+</script>
+</head>
+<input type="text" name="coursename"> Bitte Kursname eingeben</input>
+
+<br/>
+<br/>
+<br/>
+<br/>
+
+<input type="radio" name="groupfinding" value="manual"> Manuelle Gruppenbildung</input>
+<input type="radio" name="groupfinding" value="multipleCriteria">Multiple Kriterien</input>
+<input type="radio" name="groupfinding" value="oneCriteria">Einfaches Kriterium</input>
+
+<br/>
+<br/>
+<br/>
+
+<input type='button' value='Weiter' id='isSelect'>
+
+
+</body>
+</html>
diff --git a/gemeinsamforschen/src/main/webapp/pages/view_start_groupfinding.html b/gemeinsamforschen/src/main/webapp/pages/view_start_groupfinding.html
new file mode 100644
index 0000000000000000000000000000000000000000..dff15ad7606f063b0654bb2d564e8d526e243e06
--- /dev/null
+++ b/gemeinsamforschen/src/main/webapp/pages/view_start_groupfinding.html
@@ -0,0 +1,103 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <style>
+ * {
+ box-sizing: border-box;
+ }
+
+ #myInput {
+ background-image: url('/css/searchicon.png');
+ background-position: 10px 12px;
+ background-repeat: no-repeat;
+ width: 100%;
+ font-size: 16px;
+ padding: 12px 20px 12px 40px;
+ border: 1px solid #ddd;
+ margin-bottom: 12px;
+ }
+
+ #myUL {
+ list-style-type: none;
+ padding: 0;
+ margin: 0;
+ }
+
+ #myUL li a {
+ border: 1px solid #ddd;
+ margin-top: -1px; /* Prevent double borders */
+ background-color: #f6f6f6;
+ padding: 12px;
+ text-decoration: none;
+ font-size: 18px;
+ color: black;
+ display: block
+ }
+
+ #myUL li a:hover:not(.header) {
+ background-color: #eee;
+ }
+
+ </style>
+</head>
+<br>
+
+<h2>Angemeldete Studenten</h2>
+
+</br>
+
+
+
+<p align="left"><u><font color="#FF0000" size="+2">Kriterienbasierte Gruppenbildung</font></u></p>
+<input type="button" value="Ändern">
+</br>
+</br>
+</br>
+
+<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name">
+
+<ul id="myUL">
+ <li><a href="#">Adele</a></li>
+ <li><a href="#">Agnes</a></li>
+
+ <li><a href="#">Billy</a></li>
+ <li><a href="#">Bob</a></li>
+
+ <li><a href="#">Calvin</a></li>
+ <li><a href="#">Hannes</a></li>
+ <li><a href="#">Zapano</a></li>
+</ul>
+
+
+
+</br>
+</br>
+</br>
+
+<input type="button" value="Gruppenbildung starten">
+
+
+<script>
+ function myFunction() {
+ var input, filter, ul, li, a, i;
+ input = document.getElementById("myInput");
+ filter = input.value.toUpperCase();
+ ul = document.getElementById("myUL");
+ li = ul.getElementsByTagName("li");
+ for (i = 0; i < li.length; i++) {
+ a = li[i].getElementsByTagName("a")[0];
+ if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
+ li[i].style.display = "";
+ } else {
+ li[i].style.display = "none";
+
+ }
+ }
+ }
+
+
+</script>
+
+</body>
+</html>
\ No newline at end of file