0

I have 2 files. 1 html and a js. The html file has check boxes. I'm setting a flag when I select a check box. And this flag has to go in the .js file. Based on whether the flag is set or not, I'll be performing some manipulations in the js file. Basically, how do I do this so that the flag set from the html file is available in the javascript file?

Thank you.

Html file

function checkWIFI(){

if(document.getElementById('wifi').checked == true) 

wifiFlag.changeFlag(true);

else 

wifiFlag.changeFlag(false); 

}

javscript file

wifiFlag = new testFlag(); 

function testFlag()

{

this.flag = false;

} 

testFlag.prototype.changeFlag = function(newFlag)

{

 this.flag = newFlag; 

}
Improve this question
3
  • 2
    Can you show some code as to what you've tried? Commented Feb 15, 2013 at 4:17
  • Is the JS included in the HTML? Commented Feb 15, 2013 at 4:21
  • yes the js is included and the checkWIFI is the onclick function Commented Feb 15, 2013 at 5:24

4 Answers 4

Reset to default
2

You can use global variables for this and declare them at the top of the JS file. Whatever you declare under the window, becomes a global variable. In your JS file, add the following line in the top.

window.flag = 0;

And in the checkbox, when you change, set the flag.

<input type="checkbox" name="flag"
       onclick="if (this.checked) window.flag = 1; else window.flag = 0;" />

Now, you can access the flag using window.flag.

if (window.flag == 1)
    // Do something
else
    // Do something
Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

Can you show what you have tried? Without that we can't help. Your question doesn't contain even a code! How do you expect us to give some answer?
html file function checkWIFI(){ if(document.getElementById('wifi').checked == true) wifiFlag.changeFlag(true); else wifiFlag.changeFlag(false); } javscript file wifiFlag = new testFlag(); function testFlag(){ this.flag = false; } testFlag.prototype.changeFlag = function(newFlag){ this.flag = newFlag; }
Even though you are new or old, if you need a help, you need to show what you have to others for better understanding. Okay, no issues, can you please update the code in the question? Putting code in comments, can you yourself read your code?. :)
@ShriramVenkataraman Code paste pannittu, code full aa select panni Ctrl + K press pannunga... :) Even this code is not readable. :) Am just teaching you...
let us continue this discussion in chat
0

In the html you declare a hidden variable 

<input type="hidden" id="hidden1" >

and set the value for it 

document.getElementById('hidden1').value = '//your returned value';

access the hidden value in your script

var x=document.getElementById("hidden1").value;
alert(x);

hope this will work for you..

Improve this answer

Comments

0

I would suggest writing the javascript that you have in your .js file in such a way that it can be given the necessary context information. So, write functions or something that you can pass in the checkbox values. This will help keep your code more reusable and will not be tied to the global window. You can initiate this code whenever a checkbox value changes, enumerate the checkbox values and pass them to your code. I would suggest against using global variables. If you absolutely have to, then namespace them.

Improve this answer

6 Comments

html file function checkWIFI(){ if(document.getElementById('wifi').checked == true) wifiFlag.changeFlag(true); else wifiFlag.changeFlag(false); } javscript file wifiFlag = new testFlag(); function testFlag(){ this.flag = false; } testFlag.prototype.changeFlag = function(newFlag){ this.flag = newFlag; }
the checkWIFI is an onclick function in the html file
Looks like it could work. You'd just need to call checkWIFI when necessary. Perhaps using jQuery to detect state changes on the checkbox, or something. edit: if the function is called on click, for the checkbox, then that should work.
checkWIFI is the onclick function, it takes care of it. But still the flag value doesnt get carried over to the javascript file. I'm not sure why
well you're creating a new object, so wherever you instantiate that object you need to continue to use it, otherwise the state will be different. so either instantiate the object in your js file and make it global, and use that instance from your html file, or use something like a singleton.
|
0

The safest approach I would suggest is use the data-attribute made available. For example,

<input type="checkbox" name="firstCheckbox" data-flag="old">

This approach allow you to graciously fall back because old browsers won't complain. You don't need extra markup for every checkbox in case you have multiple ones. Using global variables can cause problems and namespace issues. Hidden values is a fine approach as well :)

You can obtain the value of the data attributes using one of 2 ways. 1) getAttribute, the old JavaScript method, you want to grab for data-flag. In jQuery, use attr(), 2) the HTML5 way, which is stored in the .dataset array property, so .dataset['flag'], and the equivalent in jQuery is .data('flag')

Angela

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.