HTML Help

leadspitndragon · Joined: 10 Sep 2009 Posts: 5

Ok I'm trying to make a duty status selection for the members of a gaming team I'm on. It's a radio button type with 3 options Active, On Leave, and On Extended Leave and a submit button that causes a prompt to pop up and ask for a password. The problem I'm having is that after you put in an approved password the page reloads and you choice is not saved. I just starting with learning html, php, asp, and javascript for this project. I have been working for a few days and here is what I have so far...

Code:

<form name="form1" select name='test1' action="" method="post">
Active:
<input type="radio" name="Status" value="Active
">
<br>
Short Leave:
<input type="radio" name="Status" value="On-LeaveA">
<br>
Extended Leave:
<input type="radio" name="Status" value="On-LeaveB">
<br>
<input name="button" type="button" id="button" value="Submit" onclick="openSesame()">
<script>
function openSesame(){
var pass = prompt("Enter the password!","");
if (pass == 'admin'){
document.form1.submit();
}
else {
alert("Wrong Password!");
}
}</script>

<script>// return the value of the radio button that is checked
// return an empty string if none are checked, or
// there are no radio buttons
function getCheckedValue(radio) {
if(!radio)
   return "";
var radioLength = radioObj.length;
if(radioLength == undefined)
   if(radio.checked)
      return radioObj.value;
   else
      return "";
for(var i = 0; i < radioLength; i++) {
   if(radio[i].checked) {
      return radio[i].value;
   }
}
return "";
}

// set the radio button with the given value as being checked
// do nothing if there are no radio buttons
// if the given value does not exist, all the radio buttons
// are reset to unchecked
function setCheckedValue(radioObj, newValue) {
if(!radioObj)
   return;
var radioLength = radioObj.length;
if(radioLength == undefined) {
   radioObj.checked = (radioObj.value == newValue.toString());
   return;
}
for(var i = 0; i < radioLength; i++) {
   radioObj[i].checked = false;
   if(radioObj[i].value == newValue.toString()) {
      radioObj[i].checked = true;
   }
}
}</script>

I have the coding in a table that holds a roster of the team members and what I want it to do is some how have the result displayed on the roster page.Also I started by looking for premade scripts and most of them require you to have a database on mysql which is something I don't have so if there is a way to do this where you get the password from a .txt file on the site's server. As you can see right now the password is in the small bit of javascript. Though the site doesn't need to be all that secure I mostly want this so team members can't mess with each others status. Now I have no clue what is wrong or what to do to get my idea to come out right so as detailed of help as possible would be appreciated.

nikki · Joined: 24 Nov 2008 Posts: 132

Since you are submitting the page, the page gets reloaded and the value of the selected radio button is lost.
Do you want to redirect the page to another page ? or what is the next thing you want to do after the user enters correct password

leadspitndragon · Joined: 10 Sep 2009 Posts: 5

Well I would be happy if it just kept the choice marked or if it put the value in text underneath, like I said I only started teaching my self this stuff for this project on Monday. If you could show how to get it to do one of those options I'd be greatly thankful.

nikki · Joined: 24 Nov 2008 Posts: 132

I have added a javascript function showSelectedValue() and changed your function getCheckedValue(). Here I am using urlQuery. Alternatively, you can use cookies to store and retrieve the value or can use any scripting language to get the selected value.

Code: <html>
<head>
   <script>
   var checkedVal;
   function openSesame(){
   var pass = prompt("Enter the password!","");
   if (pass == 'admin'){
      checkedVal = getCheckedValue();
      location.href = "a.html?" + checkedVal; // a.html is the my html page

   }
   else {
   alert("Wrong Password!");
   }
   }



   // return the value of the radio button that is checked
   // return an empty string if none are checked, or
   // there are no radio buttons
   function getCheckedValue() {

      var radioObj = document.getElementsByName("Status");

      for(var i = 0; i < radioObj.length; i++){
         if(radioObj[i].checked){
            checkedVal = radioObj[i].value;
         }
      }
      return checkedVal;
   }

   // set the radio button with the given value as being checked
   // do nothing if there are no radio buttons
   // if the given value does not exist, all the radio buttons
   // are reset to unchecked
   function setCheckedValue(radioObj, newValue) {
      if(!radioObj)
      return;
      var radioLength = radioObj.length;
      if(radioLength == undefined) {
      radioObj.checked = (radioObj.value == newValue.toString());
      return;
      }
      for(var i = 0; i < radioLength; i++) {
      radioObj[i].checked = false;
      if(radioObj[i].value == newValue.toString()) {
      radioObj[i].checked = true;
      }
      }
   }

   function showSelectedValue(){
      var urlquery=new Array();
      urlquery=location.href.split("?");

      if(urlquery.length > 1){
         var radioObj = document.getElementsByName("Status");

         for(var i = 0; i < radioObj.length; i++){
            if(radioObj[i].value == urlquery[1]){
               radioObj[i].setAttribute("checked", true);
            }
         }
      }
   }


   </script>


</head>
<body onload = showSelectedValue();>
   <form name="form1" select name='test1' action="" method="post">
   Active:
   <input type="radio" name="Status" value="Active">
   <br>
   Short Leave:
   <input type="radio" name="Status" value="On-LeaveA">
   <br>
   Extended Leave:
   <input type="radio" name="Status" value="On-LeaveB">
   <br>
      <input name="button" type="button" id="button" value="Submit" onclick="openSesame()">
   </form>
</body>
</html>

Hope this helps

leadspitndragon · Joined: 10 Sep 2009 Posts: 5

Hmmm it kept the value after the submit but when I tried exiting and going going back to the page it was blank again. So it looks like I have 2 problems now first is there a way to make a password for each name on my roster list and second how do I use the cookies or any thing else so that the next time some one comes to the page all the submitted values will still be there, or if another user goes to the page he needs to be able to see each member's submitted value. Do I have to have a data base so that it can recall the values and the passwords or is there some way to get around the database thing. Also thanks a lot for the help so far after a week of trying to learn so many different languages I was feeling a little confused.

nikki · Joined: 24 Nov 2008 Posts: 132

You need database to store the data so that any user can see the value.
You can use JSPs and servlets.

http://www.roseindia.net/ . Go through this link to learn Java step by step. You can also google for other tutorials

leadspitndragon · Joined: 10 Sep 2009 Posts: 5

I looked at that stuff and it seams a bit over my head and what isn't sounds like a repetition of what I saw in the php, javascript, and html examples and tutorials. Hate to be a pain but its just not making much sense and starting to feel a bit over whelming cause it looks like I'd need 4 or more files just to do this. It's a lot easier to see why people have to take years of classes to understand this stuff and then get paid so much for working with it. I found a nice site that has free mysql databases through a google search so if I ever figure this stuff out I can get easy access to a database. Also it seams like the tutorials are either lacking on details and kinda expect you to know all of the basics or give examples but only of the basics. So its like the middle ground is lost.

leadspitndragon · Joined: 10 Sep 2009 Posts: 5

Is there no way to use something like a .txt file instead of a database. Like some thing that can just sit in a folder in the site's files. Or is a database the absolute only way.