Ad:

PHP Discussion Thread
Marked Solved
Views: 1060

Nov 6th, 2009

radio button validation

Expand Post »

we have two radio buttons with same name. when we check radiobutton no.of imagefile boxes appear.
for example i have two radio buttons. if i check 1 radio button appear 5 image upload fields. now selects another radio button selects then appear only 10 image upload field. anybody help.

Last edited by muralikalpana; Nov 6th, 2009 at 10:40 am.

Similar Threads

How to insert a value from radio button in mysql in PHP
Map, Radio Button, and Coordinates in Java
radio button looses the selected state after validation in JavaScript / DHTML / AJAX
radio button validation problem in JavaScript / DHTML / AJAX
radio button validation in JavaScript / DHTML / AJAX

muralikalpana

Reputation Points: 21

Solved Threads: 35

Posting Pro

Offline

534 posts
since Sep 2009

Permalink

Nov 6th, 2009

-1

Re: radio button validation

AM I correct in assuming you have:
2 radiobuttons - one to display 5 file upload fields and one to display 10 upload fields.

A quick and dirty solution would be to hide/show through javascript and css:

PHP Syntax (Toggle Plain Text)
<input name="showups" type="radio" value="0" onclick="show_up(5);return false;" selected="selected" /><label for="show5">Show 5 upload fields</label>
<input name="showups" id="show10" type="radio" value="1" onclick="show_up(10);return false;" /><label for="show10">Show 10 upload fields</label>
 
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<div id = "extras" class="show">
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
</div>
<input name="showups" type="radio" value="0" onclick="show_up(5);return false;" selected="selected" /><label for="show5">Show 5 upload fields</label>
<input name="showups" id="show10" type="radio" value="1" onclick="show_up(10);return false;" /><label for="show10">Show 10 upload fields</label>

<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<div id = "extras" class="show">
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
</div>

This gives an array of file elements (0 - 9).
In your head area:

PHP Syntax (Toggle Plain Text)
<script>
function show_up(x){
  if(x > 5){
     document.getElementById('extras').className = 'show';
  }else{
     document.getElementById('extras').className = 'hide';
  }
}
</script>
<style>
  .hide{
     display:none;
  }
</style>
<script>
function show_up(x){
  if(x > 5){
     document.getElementById('extras').className = 'show';
  }else{
     document.getElementById('extras').className = 'hide';
  }
}
</script>
<style>
  .hide{
     display:none;
  }
</style>

If you fill file widgets in range 5-9 and then hide the last 5, they will still try to upload the files - so you could write something a bit "cleverer" to deal with this. This is just an example - I wouldn't use this in a production site.

ardav

Sponsor

Featured Poster

Reputation Points: 1054

Solved Threads: 949

Sarcastic Poster

Offline

6,700 posts
since Oct 2006

Permalink

Nov 7th, 2009

Re: radio button validation

Click to Expand / Collapse Quote originally posted by ardav ...

AM I correct in assuming you have:
2 radiobuttons - one to display 5 file upload fields and one to display 10 upload fields.

A quick and dirty solution would be to hide/show through javascript and css:
PHP Syntax (Toggle Plain Text)
<input name="showups" type="radio" value="0" onclick="show_up(5);return false;" selected="selected" /><label for="show5">Show 5 upload fields</label>
<input name="showups" id="show10" type="radio" value="1" onclick="show_up(10);return false;" /><label for="show10">Show 10 upload fields</label>
 
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<div id = "extras" class="show">
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
</div>
<input name="showups" type="radio" value="0" onclick="show_up(5);return false;" selected="selected" /><label for="show5">Show 5 upload fields</label> <input name="showups" id="show10" type="radio" value="1" onclick="show_up(10);return false;" /><label for="show10">Show 10 upload fields</label> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> <div id = "extras" class="show"> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> <input type="file" name="upload[]" /> </div>
This gives an array of file elements (0 - 9).
In your head area:
PHP Syntax (Toggle Plain Text)
<script>
function show_up(x){
  if(x > 5){
     document.getElementById('extras').className = 'show';
  }else{
     document.getElementById('extras').className = 'hide';
  }
}
</script>
<style>
  .hide{
     display:none;
  }
</style>
<script> function show_up(x){ if(x > 5){ document.getElementById('extras').className = 'show'; }else{ document.getElementById('extras').className = 'hide'; } } </script> <style> .hide{ display:none; } </style>
If you fill file widgets in range 5-9 and then hide the last 5, they will still try to upload the files - so you could write something a bit "cleverer" to deal with this. This is just an example - I wouldn't use this in a production site.

PHP Syntax (Toggle Plain Text)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>
function show_up(x){
 
  if(x > 5){
     document.getElementById('extra').style.display = 'table-cell';
	 document.getElementById('extras').style.display = 'none';
  }else{
     document.getElementById('extras').style.display = 'table-cell';
	 document.getElementById('extra').style.display = 'none';
  }
}
</script>
<style>
  .hide{
     display:none;
  }
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
 
<body>
<form name="form" method="post">
<input name="showups" type="radio" value="0" onclick="show_up(5);return false;"/><label for="show5">Show 5 upload fields</label>
<input name="showups" id="show10" type="radio" value="1" onclick="show_up(10);return false;"/><label for="show10">Show 10 upload fields</label>
<div id = "extra" class="show" style="display:none">
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
</div>
<div id = "extras" class="show" style="display:none">
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
</div>
 
</form>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>
function show_up(x){

  if(x > 5){
     document.getElementById('extra').style.display = 'table-cell';
	 document.getElementById('extras').style.display = 'none';
  }else{
     document.getElementById('extras').style.display = 'table-cell';
	 document.getElementById('extra').style.display = 'none';
  }
}
</script>
<style>
  .hide{
     display:none;
  }
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>
<form name="form" method="post">
<input name="showups" type="radio" value="0" onclick="show_up(5);return false;"/><label for="show5">Show 5 upload fields</label>
<input name="showups" id="show10" type="radio" value="1" onclick="show_up(10);return false;"/><label for="show10">Show 10 upload fields</label>
<div id = "extra" class="show" style="display:none">
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
</div>
<div id = "extras" class="show" style="display:none">
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
<input type="file" name="upload[]" />
</div>

</form>
</body>
</html>

Quote ...

see once its working. but radio button checking problem. what is the solution for this.

muralikalpana

Reputation Points: 21

Solved Threads: 35

Posting Pro

Offline

534 posts
since Sep 2009

Permalink

Nov 7th, 2009

-1

Re: radio button validation

Change this line to hide the extras by default:

PHP Syntax (Toggle Plain Text)
<div id = "extras" class="hide">
<div id = "extras" class="hide">

Also you need a selected="selected" attribute inside the first radiobutton to ensure that the first one (5 file) is 'on'.

ardav

Sponsor

Featured Poster

Reputation Points: 1054

Solved Threads: 949

Sarcastic Poster

Offline

6,700 posts
since Oct 2006

This thread is solved

Either the thread starter or a moderator has marked this thread as solved. You can most likely trust the responses and answers given. There is most likely no reason for any further responses to be posted here. If you have a related question, please start a new thread in this forum instead.

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.

Previous Thread in PHP Forum Timeline: My OOP based login -- Help me start

Next Thread in PHP Forum Timeline: Plugin could not be activated because it triggered a fatal error.

DaniWeb Message

Cancel Changes

User Name
Password