Fix attachSelectToSendableChooser function to set the selected value

- Also add an example page that shows how to use it
robotpy · Feb 7, 2016 · 04f3553 · 04f3553
1 parent 882faf0
commit 04f3553
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 1 deletion.
diff --git a/example/www/autonomous.html b/example/www/autonomous.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="utf-8">
+</head>
+<body>
+
+<!-- This starts the NetworkTables websocket, it can be accessed from multiple
+     pages simultaneously -->
+<script src="/networktables/networktables.js"></script>
+
+<!-- Obviously, you will want to copy this file locally in a real 
+     dashboard, as the Driver Station won't have internet access -->
+<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.14/d3.min.js"></script>
+
+<!-- utility functions to attach to a sendable chooser -->
+<script src="/networktables/utils.js"></script>
+
+<div>
+  Robot: <span id="robotstate">Unknown state</span>
+</div>
+
+Autonomous: <select id="autonomous"></select>
+
+<script type="text/javascript">
+"use strict";
+
+function onRobotConnection(connected) {
+	$('#robotstate').text(connected ? "Connected!" : "Disconnected");
+}
+
+$(document).ready(function(){
+  // sets a function that will be called when the robot connects/disconnects
+	NetworkTables.addRobotConnectionListener(onRobotConnection, true);
+
+  // attaches the select element to a SendableChooser object
+  attachSelectToSendableChooser("#autonomous", "Autonomous Mode");
+});
+
+
+</script>
+
+</body>
+</html>
diff --git a/pynetworktables2js/js/utils.js b/pynetworktables2js/js/utils.js
@@ -40,7 +40,7 @@ if ($ === undefined) {
 function attachSelectToSendableChooser(html_id, nt_key) {
 
     if (!nt_key.startsWith('/')) {
-        nt_key = '/SmartDashboard' + nt_key;
+        nt_key = '/SmartDashboard/' + nt_key;
     }
 
     function update(key, value, isNew) {
@@ -50,6 +50,10 @@ function attachSelectToSendableChooser(html_id, nt_key) {
     NetworkTables.addKeyListener(nt_key + '/options', update, true);
     NetworkTables.addKeyListener(nt_key + '/default', update, true);
     NetworkTables.addKeyListener(nt_key + '/selected', update, true);
+
+    $(html_id).change(function() {
+      NetworkTables.putValue(nt_key + "/selected", $(html_id).val());
+    });
 }