Jump to content

DoyleChris98

Members
  • Posts

    37
  • Joined

  • Last visited

Everything posted by DoyleChris98

  1. I have created a Websocket between my webpage and a application acting like a server on my computer. And the program is sending data though the Websocket, but i am trying to display it. When i open the page in the Chrome Developers Tools i get this. {"message":"SIMCONNECT_RECV_ID_SIMOBJECT_DATA","value":{"COM1_A":128.250000,"COM1_S":128.300003,"COM2_A":127.800003,"COM2_S":127.900002,"NAV1_A":108.500000,"NAV1_S":117.199997,"NAV2_A":110.599998,"NAV2_S":116.800003,"ADF1_A":284.000000,"ADF2_A":240.000000,"XPDR_A":4608}} Now im trying to figure out how to display the data into a div on my webpage. The old way i was displaying it was this way. Javascript jqXHR = $.getJSON("http://" + location.hostname + "/add_definition?definition_name=RADIO&name=COM1_A&PropertyName=COM ACTIVE FREQUENCY:1&UnitName=MHz&DatumType=FLOAT32", function(dane) {});jqXHR = $.getJSON("http://" + location.hostname + "/get?definition_name=RADIO", function(data){definition_data = data;});if (definition_data == undefined)return;var C1A = document.getElementById("COM1A");C1A.innerHTML = definition_data.COM1_A.toFixed(3); HTML <div class="DISP1" id="COM1A" type="button" name="COM1A" onclick="SETFREQ('com1_swap',1)">XXX.XXX</div> Im not sure how to display the data from the message into my page to display.
  2. Well i got it to work with the code you gave in post #9 jsfiddle. Next question can i make it so the to buttons act like radio buttons that shut off on when the other is clicked.
  3. No your code you gave me, when you pressed the test it change the other button. What i want is to change the button that you click. so what im reading on the internet is that i cant call a function in javascript, (i.e.:Function changeclass()) and have it run a function and change the class. I haft to use jquery toggleclass() outside and use it to look for a button press to change the class. When i can use a onclick() in html and have a javascript function change it.
  4. Well this is what i have this. function changeclass(){ $("#testid").click(function(){ $("#testid").removeClass("testclass").addClass("testclassclicked"); });var a = 2;var b = a + a;alert(;} I can get it to do the addition and display it but sometime the button changes color and others it dosen't. Is there a way to change it back.
  5. First its not that i want the button to just change the look i want it to run a function like add 2+2. Example. again function add(){ toggleclass() or whatever changes the class of the button to the clicked state. var a = 2; var b = a+a; alert (; that is what i want to do. As for javascript being inline, its the best way right now to test things. Once testing is done then i will create a separate file.
  6. well the example i put in the fiddle is just a example that i was trying to use. Im not sure on how to code it that is why I'm here trying to learn. I understand that things can't change till the page fully loaded. In the fiddle that you posted when you click the test button it changes the clicked example button, and I would like it to change the button that you click i.e. the test button. Next if i do use the code to change the button, can i still use the onClick() to run a function that is with the button click. Also need it to change back to the black background green text when you click it again, like turning a button on and off.
  7. I made a JSFiddle with some code but dosent work when clicked. The test button is the way it looks before clicked, then the clicked example is what it looks like after clicked. JSFiddle
  8. I have another thread in HTML working with it at http://w3schools.invisionzone.com/index.php?showtopic=52535. Looking into addClass() and removeClass() on the examples and i have a few questions. In the example they are changing the <p> of the HTML code. <p class="intro">This is a paragraph.</p> The code I'm using is this. <div><input type="button" class="RADIO" checked="checked" id="COM1TX" name="COMTX" value="COMTX1"><input type="button" class="RADIO1" id="COMRX" name="COMRX" value="COMRX"><input type="button" class="RADIO" id="COM2TX" name="COMTX" value="COMTX2"><input type="button" class="RADIO2" id="NAV1I" name="NAV1I" value="NAV1I"></div> I have buttons that need to act like Radio buttons and Check boxes and was going to try to use javascript to change the look of them onclick(), and run a function associated with the button. Instead of using <p> or <div> can you use the ID for the $("p:last").removeClass("radiounclicked").addClass("radioclicked"); ID COM1TX and COM2TX are radio buttons where one turns on and the other shuts off. And the rest are like Check Boxes where you can turn them on and off. Here is the JSFiddle for it and the Fullscreen JSFiddle.
  9. I was wondering if javascript or jquery could change the look of a CSS class in a function called by a onclick(). For example I have a #first and also a .unclicked and .clicked. And i have a input type="button" id="first" class="unclicked" onclick="function()". function(){ change class from unclicked to clicked on first then some other code } Inside the function how do i change the class from unclicked to clicked. I know you haft to use the document.getid(first).style, but I'm not sure how to get the function to change it.
  10. The program uses a a webpage function to set items. For example in the picture above Pad2 in post #15 if you click one of the XXX.XXX it calls a function. <div class="DISP2" id="COM1S" name="COM1S" onclick="CONVERT(this)">XXX.XXX</div> Function function CONVERT(event){ FREQ = parseFloat(document.getElementById("INPUT").value); FREQ = FREQ.toFixed(2); var n1 = FREQ.substr(0, FREQ.indexOf(".")); n1 = n1.substr(n1.length-2); var n2 = FREQ.substr(FREQ.indexOf(".")+1,2); var bcd = (parseInt(n1.charCodeAt(0) - 0x30 )<<12) + (parseInt(n1.charCodeAt(1) - 0x30 )<<8) + (parseInt(n2.charCodeAt(0) - 0x30 )<<4) + parseInt(n2.charCodeAt(1) - 0x30 ); document.getElementById("INPUT").value = ""; SETFREQ(event.id, bcd);}function SETFREQ(event, value){ $.ajaxSetup({ cache: false }); // nedeed for IE8 $.support.cors = true; // required if the script is local $.ajaxSetup({ async: false }); var jqXHR = $.getJSON("http://" + location.hostname + "/set_event_value?name=" + event + "&value=" + value, function(dane){}); $.ajaxSetup({ async: true }); } Now with the Buttons i will need a talk back to change the state in the webpage if its changed in FSX, but that is something ill work on later. I know i can change the state of the button with Jquery, but i was seeing if i could use Radio Buttons and Check Boxes.
  11. Alright i through together what it should look like but function isn't all the way there and i have attached a jsfiddle of it to. In the fiddle i use focus to show the change when active. COM 1 Tx and COM 2 Tx (with yellow to ID them in the picture) should act like Radio Buttons turn on on the other shuts off. The rest should act like Check Boxes to turn on and off. Later they will be calling a function when clicked but thats later. https://jsfiddle.net/zxo0myah/ Fullscreen https://jsfiddle.net/zxo0myah/embedded/result/
  12. Ok here is the story. Theirs a program that comes with Microsoft Flight Simulator (FSX) called Simconnect which you can right C++ programs to access FSX though Simconnect. A person made a program that accesses Simconnect through a webpage called Websimconnect (Webpage <-> Websimconnect <-> Simconnect <-> FSX). Things that you can do is change Radios, Display your location on google maps from FSX, and many other things. What i'm trying to create is a LCD radio display that you can enter the Frequency and change radios that shows up on a website. I have the keypad layout done but trying to add a few more buttons. The buttons turn on and off the Radios, Which act like a Checkboox and radio buttons. Buttons-2 picture shows the buttons inside FSX, with COM 1 Active COM 2 off with everything else. Buttons-3 picture shows COM 2 active which shuts off COM 1 (like a Radio Button) and the rest turn on and stay on like a check box. Pad2 shows the way i would like it to look, where the buttons i want to add are on the left side. And all the buttons change background and text color when clicked. Hopefully that explains it enough.
  13. Anybody with a idea on this. I wa able to get the Radio Buttons to move but i cant get the checkboxes to Style and also i cant figure out the location with the relative setting. I dont know what the location is relative to.
  14. Its used for a game Microsoft Flight Simulator, its for entering radio frequencies from a webpage. you press the keypad buttons (0-9, ., C, to enter the frequency in the input box then press the bottom XXX.XXX to enter the frequency, then it enters it into FSX. Also i can open the ATC window with the small buttons next to the input box. And the buttons that i need the Radio and Check Boxes for turn on and shut off the radios. The XXX.XXX show up because i dont have FSX running at the time of the picture. I was using the DIV tags because it was either here or at stackoverflow that somebody told me to use the DIV tag to make the grid layout.
  15. Well your half right, the color when activated is right. But I would like COM and COM2 set up and radio buttons, so whe you click on COM it lights up but when you click COM 2, COM 2 lights up and COM turns off. Ill attach a picture of how and where i want them to go. If you look at the picture the line that the arrow is pointing at its at 840px from the left. That is where the buttons will line up from the left and the height from the top will be solved when when the left is figured out. and in the picture there is COM 1 Tx, COM 1,2 Rx, COM 2 Tx. Where COM 1 Tx and COM 2 Tx will be radio buttons and COM 1,2 Rx is like a checkbox.
  16. Well absolute is all i know how to use right now, and with the way i have things setup i dont know what to reference for relative postition. And the COM 4 is the way it would look if it was selected. This all works with a keypad i made, all the keypad buttons are absolute position and work fine. But i need the Radio Buttons and Check Boxes to turn certain things on and off. I only need 2 radio buttons and the rest are check boxes.
  17. What im saying is, I want the radio and checkbox to look like the buttons in the picture. which with some tinkering around i got it to look the right way before being pressed and after being pressed but i cant get them to move to a new location. example I want the buttons left edge at 840px from the left but i cant get them to move there. but i can make them highlight and unhighlight the right way.
  18. What i am trying to do is create 3 items 2 are radio buttons and the other is a check box. I would like to give the 3 of them CSS styles and have them change the background and text color when selected or checked. below is the code and examples. first in the pictures are the layout of the Buttons and Checkbox. then below is the css style i want them to look like when done. pay no attention to the label of the css boxes i did that to give a example of selected and unselected. unselected is black background and green text and selected is the reverse. <!doctype html><html><head><meta charset="utf-8"><link href="Button.css" rel="stylesheet" type="text/css"></head><body><input type="radio" id="COM1TX" name="COMTX">COM 1 Tx<br><input type="checkbox" id="COMRX" name="COMRX">COM 1,2 Rx<br><input type="radio" id="COM2TX" name="COMTX">COM 2 Tx<br><div><input class="TEST" id="COM" type="button" name="COM" value="COM"><input class="TEST" id="COM2" type="button" name="COM2" value="COM2"></div><div><input class="TEST" id="COM3" type="button" name="COM3" value="COM3"><input class="TEST" id="COM4" type="button" name="COM4" value="COM4"></div> </body></html> @charset "utf-8";/* CSS Document */#COM{ width: 150px; height: 100px; position: absolute; top: 100px; left: 0px; cursor: crosshair;}#COM2{ width: 150px; height: 100px; position: absolute; top: 200px; left: 0px; cursor: crosshair;}#COM3{ width: 150px; height: 100px; position: absolute; top: 100px; left: 150px; cursor: crosshair;}#COM4{ width: 150px; height: 100px; position: absolute; top: 200px; left: 150px; cursor: crosshair; color: #000000; background-color: #00F349;}.TEST{ background-color: #000000; color: #00F349; text-align: center; border: thin solid #00F349; line-height: 100px; vertical-align: middle; font-size: 50px; cursor:crosshair;}.TEST:active{ background-color: #00F349; color: #000000; text-align: center; border: thin solid #00F349; line-height: 100px; vertical-align: middle; cursor:crosshair;}
  19. Ok thats do able Justsomeguy, but the problem im having is passing the value from the button press to the display, and storing it then adding the next number to the display. So i press 1 displays 1 then press 2 and it displays 12 press period and 12. is displayed. But the code in post #16 gives me a NAN with the first number pressed, but if i put 1 in to begin it adds what is pressed to 1. So you enter 1 then press 2 you should get 12 but you get 3.
  20. I'm running a game called Microsoft Flight Simulator 10 (FSX). And with the game comes a program called Simconnect. It allows programs written in C++ to change parameters in FSX. Now a person wrote a program called Websimconnect that you can write a webpage to change the parameters. And what im trying to do is make a LCD looking display to enter and change the frequencies of 11 radios. The basic thing is when you press the numbers it enters in the numbers in like a calculator screen. Then you press another button and set one of the radios. I have the communication between FSX and Websimconnect working but i cant get the keypad to work to enter the numbers. The radios are in BCD (binary coded decimal) so i need to take wats entered and convert it. That part is working but i have a alert box asking for the frequency then passes it to a function to convert it and then another that sends it to FSX. So all i need it to do is take whats entered and send it to the function. I added a picture of the page im working on.
  21. Im taking whats entered in the box with the keypad, and going to another function to convert it to HEX, Binary, then putting it into a variable to return to a program.
  22. now i cant get the numbers to appear when i press them. But if i put "1" in the textbox to begin with then when i press the one key it adds a 1 to it to make 2 then displays 2. i want it to display each number pressed and put in the new position. So you press 1 you get 1 you press 2 you get 12 i the box. <input type="text" id="INPUT" name="INPUT"><div><input class="NUM" id="B1" type="button" name="no" value="1" onClick="NUMBERS(this.value)"><input class="NUM" id="B2" type="button" name="no" value="2" onClick="NUMBERS(this.value)"><input class="NUM" id="B3" type="button" name="no" value="3" onClick="NUMBERS(this.value)"><input class="NUM" id="B4" type="button" name="no" value="4" onClick="NUMBERS(this.value)"><input class="NUM" id="B5" type="button" name="no" value="5" onClick="NUMBERS(this.value)"><input class="NUM" id="B6" type="button" name="no" value="6" onClick="NUMBERS(this.value)"><input class="NUM" id="B7" type="button" name="no" value="7" onClick="NUMBERS(this.value)"><input class="NUM" id="B8" type="button" name="no" value="8" onClick="NUMBERS(this.value)"><input class="NUM" id="B9" type="button" name="no" value="9" onClick="NUMBERS(this.value)"><input class="NUM" id="B0" type="button" name="no" value="0" onClick="NUMBERS(this.value)"><input class="NUM" id="BP" type="button" name="no" value="." onClick="NUMBERS(this.value)"><input class="NUM" id="BC" type="button" name="no" value="0" onClick="NUMBERS(this.value)"></div><div type="text" class="DISPT" id="INPUT1" name="INPUT" contenteditable="true" value="1">ENTER</div><div class="DISP1" id="COM1A" name="COM1A" onClick="CONVERT(this)">C1S</div> function NUMBERS(num){ var txt = document.getElementById("INPUT").value; txt = parseInt(txt) + parseInt(num); document.getElementById("INPUT").value = txt;}
  23. I am making a keypad that has 0-9, a period, and C. I am trying to figure out how to get the text to vertical align. Here is the code. <div class="NUM" id="B1">1</div><div class="NUM" id="B2">2</div><div class="DISP1" id="COM1A" name="COM1A" onClick="CONVERT(this)">C1S</div> #B1 { width: 50px; height: 50px; top: 50px; position: absolute; left: 0px; vertical-align: middle;}#B2 { top: 150px; position: absolute; width: 50px; height: 50px; vertical-align: middle;}#COM1A { width: 80px; height: 25px;}.NUM{ background-color: #000000; color: #00F349; text-align: center; border: thin solid #00F349;}
  24. What im working is a keypad to enter numbers in then pass it to a radio frequency. I have all the other code set just trying to get the numbers to line up and look good and function. Picture below. All the numbers has there own class and location on the pad. What i dont know is if i use the same class as all the numbers how do i lay them out in a keypad format. Example of CSS #button_1 { width: 80px; height: 80px; position: absolute; color: #00F349; text-align: center; border: thin solid #00F349; background-color: #000000; font-size: 50px; top: 50; left: 0; vertical-align: middle;}#button_2 { width: 80px; height: 80px; padding-top: 5px; padding-bottom: 5px; color: #00F349; font-size: 50px; text-align: center; border: thin solid #00F349; background-color: #000000; position: absolute; top: 50px; left: 80px;}
×
×
  • Create New...