Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 01-04-2013, 04:52 PM   PM User | #1
connollyc4
New Coder

 
Join Date: Mar 2010
Location: New Jersey USA
Posts: 74
Thanks: 11
Thanked 4 Times in 4 Posts
connollyc4 is an unknown quantity at this point
Question Disabling fixed textareas after a number is chosen

Hello All.

I need help disabling text area's after a choice has been picked.

I have 3 fixed text areas
1st: 1,2,3
2nd: 4,5,6
3rd: 7,8,9

I also have 3 input text areas.

What I am trying to do is if you put the number '7' in input text area 1 then all numbers in the 3rd fixed text area become disabled unless you delete the 7

if you type in text area 1 the number 5 then the fixed text area disables 4 and 6 unless you delete the 5 to reselect.

below is my code so far.

Code:
<script type="text/javascript"> 

function checkForInvalid(obj) {
obj.value = obj.value.replace(/[^0-9]/gi,"");
return true;
}
//add-delete depeding on games
var nums = ["","","",""]; 
 
 
function chkNoDups(which,numb) {
 
w = which;  
n = numb; 
 
var val = parseInt(w.value,10);
if (val == 0 || val >16) {  // Chage depending on games that week.
alert ("Invalid Entry - value entered must be 1 - 16") // change this too 
w.value = "";  
setTimeout('w.focus(); w.select();', 25);  
return false;
}
 
 
nums[numb] = val;
testDups();
 
var numbers = [1,2,3];
var  arr = [];
 
//Text Area part change depending on how many games
arr[0] = document.myForm.one.value;
arr[1] = document.myForm.two.value;
arr[2] = document.myForm.three.value;
//arr[3] = document.myForm.four.value;
//arr[4] = document.myForm.five.value;
//arr[5] = document.myForm.six.value;
//arr[6] = document.myForm.seven.value;
//arr[7] = document.myForm.eight.value;
//arr[8] = document.myForm.nine.value;
//arr[9] = document.myForm.ten.value;
//arr[10] = document.myForm.eleven.value;
//arr[11] = document.myForm.twelve.value;
//arr[12] = document.myForm.thirteen.value;
//arr[13] = document.myForm.fourteen.value;
//arr[14] = document.myForm.fifteen.value;
//arr[15] = document.myForm.sixteen.value;
 
 
for (var i = 0; i<numbers.length; i++) {
for (var j = 0; j<arr.length; j++) {
if (arr[j] == numbers[i]) {
numbers[i] = "";
}
}
}
 
var noblanks = [];
for (var i =0; i<numbers.length; i++) {
if (numbers[i]){ noblanks.push(numbers[i])} 
}
var joined = noblanks.join(" ");
document.myForm.ta1.value = joined;
 
 
// Calculates total points entered my remove
var len = nums.length; 
var tot = 0;
for (var i = 0; i<len; i++) {
if (isNaN(nums[i])) {nums[i] = ""}
if (nums[i] !="") {
tot = tot + nums[i];
}
}
document.myForm.total.value = tot;
}
 
function testDups() {
var len = nums.length;
for (var i = 1; i <len; i++) {
for (var j = 2; j <len; j++) {
if ((nums[i] !="") && (i!=j) && (nums[i] == nums[j])) {
alert ("The number " + nums[j] + " is a duplicate!");
nums[n] = "";
w.value = "";
}
}
}
 
}

</script>
 
 
</head>


 
 
 
 <FORM METHOD=Post " ACTION="./fantasy/week17/week17.php" name="myForm"> 


<br>
<br>
<br>
<br>
 
 
 
<textarea name = "ta1" style="position:fixed" rows = "4" cols = "14">1 2 3 </textarea>
<br>
<textarea name = "ta2" style="position:fixed" rows = "4" cols = "14">4 5 6 </textarea> 
<br>
<textarea name = "ta3" style="position:fixed" rows = "4" cols = "14">7 8 9 </textarea>


 
<br>
<br>
 

<div id="right">
 
<h2> 
<br>
 
</h2>
 
 
<center>
 
<table class=MsoTableGrid border=0 cellspacing=0 cellpadding=0
 style='border-collapse:collapse;border:none'>
 
<tr><td width=223 valign=top style='width:167.4pt;border:none windowtext 
1.0pt;
  padding:0in 5.4pt 0in 5.4pt'>
  <p class=MsoNormal>&nbsp;</p>
<BR>&nbsp;<font color="red"><u> <b>CP</b></u> </font> &nbsp;&nbsp;
<u>Away Team </u>
</td>
 
<td width=204 valign=top style='width:153.0pt;border:none windowtext 
1.0pt;
  border-left:none;padding:0in 5.4pt 0in 5.4pt'>
<p class=MsoNormal>&nbsp;</p><br>&nbsp;&nbsp;&nbsp;
<u>Home Team</u>
 
</td></tr>
 
 
 
 <tr>
  <td width=223 valign=top style='width:167.4pt;border:none windowtext 
1.0pt;
  padding:0in 5.4pt 0in 5.4pt'>
  <p class=MsoNormal>&nbsp;</p>
<br>
<input type="text" name="one" size="1" maxlength="2" onkeyup="checkForInvalid(this)";  onblur = "chkNoDups(this,1)">
<INPUT TYPE=RADIO NAME="game1" VALUE="Tampa Bay Buccaneers">Tampa Bay Buccaneers<BR>
 
 
 
  </td>
  <td width=204 valign=top style='width:153.0pt;border:none windowtext 
1.0pt;
  border-left:none;padding:0in 5.4pt 0in 5.4pt'>
 
  <p class=MsoNormal>&nbsp;</p>
<br>    <INPUT TYPE=RADIO NAME="game1" VALUE="Atlanta Falcons">Atlanta Falcons<BR>
 
 
</td>
 
 </tr>
 <tr>
  <td width=223 valign=top style='width:167.4pt;border:none windowtext 
1.0pt;
  border-top:none;padding:0in 5.4pt 0in 5.4pt'>
  <p class=MsoNormal>&nbsp;</p>
 
 <br>
<br>
<br>
<input type="text" name="two" size="1" maxlength="2" onkeyup="checkForInvalid(this)";  onblur = "chkNoDups(this,2)">
<INPUT TYPE=RADIO NAME="game2" VALUE="New York Jets">New York Jets<BR>
 
 
</td>
  <td width=204 valign=top 
style='width:153.0pt;border-top:none;border-left:
  none;border-bottom:none windowtext 1.0pt;border-right:none windowtext 
1.0pt;
  padding:0in 5.4pt 0in 5.4pt'>
  <p class=MsoNormal>&nbsp;</p>
 <br>
<br>
<br>
<INPUT TYPE=RADIO NAME="game2" VALUE="Buffalo Bills">Buffalo Bills<BR>  
 
</td>
 </tr>
 <tr>
 
  <td width=223 valign=top style='width:167.4pt;border:none windowtext 
1.0pt;
  border-top:none;padding:0in 5.4pt 0in 5.4pt'>
  <p class=MsoNormal>&nbsp;</p>
 
<br> 
<input type="text" name="three" size="1" maxlength="2" onkeyup="checkForInvalid(this)";  onblur = "chkNoDups(this,3)">
<INPUT TYPE=RADIO NAME="game3" VALUE="Baltimore Ravens">Baltimore Ravens<BR>
 
</td>
  <td width=204 valign=top 
style='width:153.0pt;border-top:none;border-left:
  none;border-bottom:none windowtext 1.0pt;border-right:none windowtext 
1.0pt;
  padding:0in 5.4pt 0in 5.4pt'>
  <p class=MsoNormal>&nbsp;</p>
 
 
 
 <br>
<INPUT TYPE=RADIO NAME="game3" VALUE="Cincinnati Bengals">Cincinnati Bengals<BR>
 
  </td>
 </tr>
 <tr>
  

 
</table>
<br><br>
</center>
 

  
 
 
<BR><br<br> <br><br> 
 
 
 
 
 
 
<INPUT TYPE=SUBMIT VALUE="submit"> <br><br>
<!-- displays total points entered. My remove -->
<input type = "text" name = "total" size="1" value = 0 readonly> 
possible points this week
<br><br>
 
</div>
 
 
<br><br><br><br>
 
</html>
connollyc4 is offline   Reply With Quote
Old 01-05-2013, 07:15 PM   PM User | #2
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,387
Thanks: 18
Thanked 350 Times in 349 Posts
sunfighter is on a distinguished road
connollyc4 I have questions about this but first in order to see what you had going and to locate the "fixed text areas" and the 3 input text areas I had to add a doctype, HTML 4.01 Transitional. Then add body tags and an end tag for the <form>. If an answer to your problem is found it might not work if you are going to increase the numbers involved.
Code:
//Text Area part change depending on how many games
arr[0] = document.myForm.one.value;
arr[1] = document.myForm.two.value;
arr[2] = document.myForm.three.value;
//arr[3] = document.myForm.four.value;
//arr[4] = document.myForm.five.value;
//arr[5] = document.myForm.six.value;
//arr[6] = document.myForm.seven.value;
//arr[7] = document.myForm.eight.value;
//arr[8] = document.myForm.nine.value;
//arr[9] = document.myForm.ten.value;
//arr[10] = document.myForm.eleven.value;
//arr[11] = document.myForm.twelve.value;
//arr[12] = document.myForm.thirteen.value;
//arr[13] = document.myForm.fourteen.value;
//arr[14] = document.myForm.fifteen.value;
//arr[15] = document.myForm.sixteen.value;
Having 16 numbers may cause problems. I'd do the deed in the function checkforinvalid(obj) which wont work if more than 9 numbers are needed. This function allows zero to be entered, an error.

Next thing is using a textarea to display. Easy to click in and change everything. Why not divs with control over the display?

Lastly, you want two separate things to occur?

What I am trying to do is if you put the number '7' in input text area 1 then all numbers in the 3rd fixed text area become disabled unless you delete the 7

if you type in text area 1 the number 5 then the fixed text area disables 4 and 6 unless you delete the 5 to reselect.

The way I read this is = if you enter the number 7 no one else can choose 7, 8, or 9. Is that correct?
sunfighter is offline   Reply With Quote
Reply

Bookmarks

Tags
disabling, javascript, textarea

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 07:52 PM.


Advertisement
Log in to turn off these ads.