diff --git a/video.h b/video.h
index e375479..732b366 100644
--- a/video.h
+++ b/video.h
@@ -87,7 +87,7 @@ class VideoDevice {
         virtual int GetFrame (VideoFrame *destframe, VideoFrameFloat *destfloat)  { debug (""); return 0; };
     	virtual int SetDevCtrl(unsigned int id, int value)  { debug (""); return 0; };
     	virtual int GetDevCtrl(unsigned int id, int *value) { debug (""); return 0; };
-        virtual std::list<VideoDevCtrl> GetDevCtrls() { Lock(); return vidctrls; UnLock(); };
+        virtual std::list<VideoDevCtrl> GetDevCtrls() { return vidctrls; };
 };
 
 #include "videodevice_v4l2.h"
diff --git a/videodevice_v4l2.cc b/videodevice_v4l2.cc
index 4a4a111..54f73e4 100644
--- a/videodevice_v4l2.cc
+++ b/videodevice_v4l2.cc
@@ -508,6 +508,16 @@ int VideoDevice_V4L2::SetDevCtrl(unsigned int id, int value) {
 		return 0;
 	}
 
+	GetDevCtrl(id, &value);
+	std::list<VideoDevCtrl>::iterator i;
+
+	for (i = vidctrls.begin(); i != vidctrls.end(); i++) {
+		if (i->id == id) {
+			i->value = value;
+			break;
+		}
+	}
+
 	return 1;
 };
 
diff --git a/webserver.cc b/webserver.cc
index c2cc442..02f0a02 100644
--- a/webserver.cc
+++ b/webserver.cc
@@ -7,6 +7,9 @@
 
 extern VideoDevice *vdev;
 
+std::string API_Get_Ctrls();
+std::string API_Set_Ctrl(std::string request);
+
 // InMemoryFile GenerateJpgFile(VideoFrame *vf);
 InMemoryTar assets;
 
@@ -37,8 +40,12 @@ int WebCamServer::HandleRequest (WebRequestBuffer *requestbuffer, WebServerClien
                                               jpgfile.memsize) != 1) return 0;
     }
     else if (request.compare("/get/ctrls") == 0) {
-        std::list<VideoDevCtrl> list;
-        list = vdev->GetDevCtrls();
+        debug ("get controls");
+        if (webclient->SendResponseData(requestbuffer, API_Get_Ctrls(), "") != 1) return 0;
+    }
+    else if (request.find("/set/ctrl") != std::string::npos) {
+        debug ("set controls");
+        if (webclient->SendResponseData(requestbuffer, API_Set_Ctrl(request), "") != 1) return 0;
     }
     else if (isfile("www"+request)) {
         if (webclient->SendResponseFile(requestbuffer, request, "") != 1) return 0;
@@ -57,3 +64,52 @@ int WebCamServer::HandleRequest (WebRequestBuffer *requestbuffer, WebServerClien
     return 1;
 };
 
+
+
+std::string API_Get_Ctrls() {
+    std::list<VideoDevCtrl> list;
+    std::list<VideoDevCtrl>::iterator i;
+    list = vdev->GetDevCtrls();
+
+    JSONParse jp;
+    JSONElement je;
+
+    je.Clear();
+    jp.Clear();
+
+    for (i = list.begin(); i != list.end(); i++) {
+        JSONParse jpe;
+        jpe.Clear();
+        jpe.AddObject("id", (int) i->id);
+        jpe.AddObject("name", i->name);
+        jpe.AddObject("value", i->value);
+        jpe.AddObject("min", i->min);
+        jpe.AddObject("max", i->max);
+        je.SetAddArray("ctrls", jpe.ToString());
+    }
+
+    jp.AddObject(je);
+    return jp.ToString();
+}
+
+
+std::string API_Set_Ctrl(std::string request) {
+    unsigned int id;
+    int value;
+    char *t = (char*) request.c_str();
+
+    int i = 0;
+    while ((t = strchr (t, '/'))) {
+        i++;
+        t++;
+        if (i == 3) id = atol (t);
+        if (i == 4) value = atoi (t);
+        if (i > 4) break;
+    }
+
+    vdev->SetDevCtrl(id, value);
+
+    JSONParse jp;
+    jp.Clear();
+    return jp.ToString();
+}
\ No newline at end of file
diff --git a/www/index.html b/www/index.html
index 423f1f7..1ab02af 100644
--- a/www/index.html
+++ b/www/index.html
@@ -21,11 +21,18 @@
     
         <table id="controls"></table>
 
+    <br>
+
+        <div id="debug">
+        </div>
+        
     
 </body>
 
 <script>
 
+let ctrls;
+    
 function reloadImage() {
     const img1 = document.getElementById('webcamimage');
     const filterimage1 = document.getElementById('floatimage');
@@ -35,8 +42,66 @@ function reloadImage() {
     img1.src = src1;
 }
 
+function refreshCtrls() {
+    let debug = document.getElementById("debug");
+
+    $.ajax({
+        type: "POST",
+        url: 'get/ctrls',
+        data: "",
+        success: function(response)
+        {
+            let jsonData = {};
+            
+            ctrls = JSON.parse(response);
+            let table = document.getElementById("controls");
+            let t = "<thead><tr><th>Name</th><th>Min</th><th>Max</th><th>Value</th></thead><tbody>";
+            ctrls.ctrls.forEach(function (elm, idx) {
+                t += "<tr><td>"+elm.name+"</td><td>"+elm.min+"</td>"+
+                     "<td>"+elm.max+"</td><td>" +
+                     "<input class=\"ctrlvalue\" dataid=\""+elm.id+"\" value=\""+elm.value+"\"></td></tr>";
+            });
+            t += "</tbody>";
+            table.innerHTML = t;
+       },
+       error: function(error) {
+           debug.innerHTML = "ERROR";
+       }
+   });
+}
+
+function setCtrl(id, value) {
+    let debug = document.getElementById("debug");
+
+    $.ajax({
+        type: "POST",
+        url: 'set/ctrl/'+id+"/"+value,
+        data: "",
+        success: function(response)
+        {
+            refreshCtrls();
+       },
+       error: function(error) {
+           debug.innerHTML = "ERROR";
+       }
+   });
+}
+    
 setInterval(reloadImage, 500);
+refreshCtrls();
 
+$(document).on('keypress', '.ctrlvalue', function(e) {
+    if (e.key === 'Enter' || e.keyCode === 13) {
+        // Hier deine Funktion einfügen
+        let id = this.getAttribute('dataid');
+        let value = this.value;
+        setCtrl(id, value);
+        
+        // Verhindert das Standard-Verhalten (z. B. Formular absenden)
+        e.preventDefault(); 
+    }
+});
+    
 </script>
 
 </html>
\ No newline at end of file