Hi,
I've put together a little test page to create checkboxes each time a button is clicked. The check button is created and should be appended to the form, but when the post is submitted the dynamic checkboxes are not available in $_POST in PHP.
Here's the code: -
<html>
-
<head>
-
<script language="Javascript">
-
-
function append()
-
{
-
var cb = document.createElement( "input" );
-
cb.type = "checkbox";
-
cb.id = "id";
-
cb.value = "test";
-
cb.checked = true;
-
var text = document.createTextNode( "checkbox" );
-
document.getElementById( 'append' ).appendChild( text );
-
document.getElementById( 'append' ).appendChild( cb );
-
}
-
-
</script>
-
</head>
-
<body>
-
<p>click the button below</p>
-
<form action="http://localhost/test.php" name="form" id="form" method="post" enctype="multipart/form-data">
-
<div id="append" name="append">Append here</div>
-
<input type="button" value="append" onclick="javascript:append()" />
-
<input type="submit" value="submit" />
-
</form>
-
</body>
-
</html>
-
Also is there a way to view the updated DOM tree at runtime? Viewing the page source doesn't show me what I've created at runtime.
Thanks,
Sean
9  48386 
add this:
php post uses the name attribute, so since u didn't have one set it couldn't find what your looking for.
good luck
one thing i noticed is that all your checkboxes will have the same name/id, u'll need to set it up so they are different.
Here you go, this should work just fine.. I set the name and created a method for counting the checkboxes as you create them. The number is then appended to the name of the checkboxes to you would references them by their number. In this way, each checkbox will indefinately have a unique name for which you can refer to in your php script. Note that the number appended to the name is kept track of using a hidden form field.
first checkbox created = 0, second = 1, etc (or you could replace the hidden form field's value with "1" - then first checkbox created = 1
..Well, you get the idea, i'm sure! -
<html>
-
<head>
-
<script language="Javascript">
-
-
function append()
-
{
-
var i = parseInt(document.getElementById( "iCheckboxes" ).value);
-
var cb = document.createElement( "input" );
-
cb.type = "checkbox";
-
cb.id = "id"+i;
-
cb.name = "name"+i;
-
cb.value = "test";
-
cb.checked = true;
-
var text = document.createTextNode( "checkbox" );
-
document.getElementById( 'append' ).appendChild( text );
-
document.getElementById( 'append' ).appendChild( cb );
-
document.getElementById( "iCheckboxes" ).value = parseInt(document.getElementById( "iCheckboxes" ).value) + 1;
-
}
-
-
</script>
-
</head>
-
<body>
-
<p>click the button below</p>
-
<form action="http://localhost/test.php" name="form" id="form" method="post" enctype="multipart/form-data">
-
<div id="append" name="append">Append here</div>
-
<input type="hidden" value="0" name="iCheckboxes" id="iCheckboxes">
-
<input type="button" value="append" onclick="javascript:append()" />
-
<input type="submit" value="submit" />
-
</form>
-
</body>
-
</html>
-
Thanks for your help guys. I didn't realise I missed setting the id. What I would like, however, is to have an array of checkboxes so they all have the same name/id - cb.id = "id[]" cb.name = "id[]"
but each checkbox has a different value. Then when the form is submitted I can get a list of the checkbox checked. It's a group of checkboxes really. When I do this I don't get anything through
. -
<html>
-
<head>
-
<script language="Javascript">
-
-
function append()
-
{
-
var i = parseInt(document.getElementById( "iCheckboxes" ).value);
-
var cb = document.createElement( "input" );
-
cb.type = "checkbox";
-
cb.id = "id[]"
-
cb.name = "id[]"
-
cb.value = "test" + i;
-
cb.checked = true;
-
var text = document.createTextNode( "checkbox" );
-
document.getElementById( 'append' ).appendChild( text );
-
document.getElementById( 'append' ).appendChild( cb );
-
document.getElementById( "iCheckboxes" ).value = parseInt(document.getElementById( "iCheckboxes" ).value) + 1;
-
}
-
-
</script>
-
</head>
-
<body>
-
<p>click the button below</p>
-
<form action="http://localhost/test.php" name="form" id="form" method="post" enctype="multipart/form-data">
-
<div id="append" name="append">Append here</div>
-
<input type="hidden" value="0" name="iCheckboxes" id="iCheckboxes">
-
<input type="button" value="append" onclick="javascript:append()" />
-
<input type="submit" value="submit" />
-
</form>
-
</body>
-
</html>
-
Well,
You can't set a check box's value, for starters. A checked checkbox is returned as "on" to your server side script, an unchecked checkbox is not even returned at all and will be null. Check boxes are basically boolean type data. True or false. On or off. Checked or unchecked. 1 or 0. - etc
Why is $POST returning nothing? Er, well - I removed your enctype=multipart/form-data" and it does - including the value of "on" for all 5 checkboxes i created and checked. Though i'm not quite sure why that made a difference.. I think that enctype is used for the GET method to encrypt the data through the querystring.. not sure about that one though. Anyway, it works using POST if you remove that.
Mark
Hi Mark,
I don't know what I'm doing wrong. Here's my code again. This is all that I'm getting in $_POST if I create three checkboxes by clicking 'Append' and then 'Submit'. - array(0) { } array(1) { ["iCheckboxes"]=> string(1) "2" }
. -
<html>
-
<head>
-
<script language="Javascript">
-
-
function append()
-
{
-
var i = parseInt(document.getElementById( "iCheckboxes" ).value);
-
var cb = document.createElement( "input" );
-
cb.type = "checkbox";
-
cb.id = "id"+i;
-
cb.name = "name"+i;
-
cb.checked = true;
-
var text = document.createTextNode( "checkbox" );
-
document.getElementById( 'append' ).appendChild( text );
-
document.getElementById( 'append' ).appendChild( cb );
-
document.getElementById( "iCheckboxes" ).value = parseInt(document.getElementById( "iCheckboxes" ).value) + 1;
-
}
-
-
</script>
-
</head>
-
<body>
-
<p>click the button below</p>
-
<form action="http://localhost/test.php" name="form" id="form" method="post">
-
<div id="append" name="append">Append here</div>
-
<input type="hidden" value="0" name="iCheckboxes" id="iCheckboxes">
-
<input type="button" value="append" onclick="javascript:append()" />
-
<input type="submit" value="submit" />
-
</form>
-
</body>
-
</html>
-
Maybe you could send me your code again.
Thanks,
Sean
This is all that I'm getting in $_POST if I create three checkboxes by
clicking 'Append' and then 'Submit'.
I'm assuming that by your statement above that after you created the 3 checkboxes you didn't check them. If a checkbox is not checked - it returns a value of null or "" or Empty - it's not returned to your code what so ever.
Otherwise the code looks pretty solid.
I will run it again later on, gotta go out for a bit here... but try creating 3 checkboxes, check them, and then submit the form and see what you get.
Sincerely,
Mark
Hi Mark,
I've been a right doofus!!!! You're right I wasn't checking the checkboxes. Only creating them. I should have realised by what you said before and I should have known any way that checkboxes are boolean.
Oh well thanks so much for your time. I'm very grateful.
Have a good evening.
Sean
No problem!
Well actually a lot of people think that checkboxes are returned as "off" if they aren't checked, and "on" if they are - but it's simply just not returned what so ever if it's not checked!
It's kind of silly actually.. You wouldn't see boolean type data anywhere else that JUST has a value of TRUE if it's true and a value of NULL if it's false right?
Sign in to post your reply or Sign up for a free account.
Similar topics
by: oeyvind toft |
last post by:
How do I create a checkbox element ? Or any other input type ?
document.createElement('checkbox') doesnt seem to work.
Oeyvind
--
http://home.online.no/~oeyvtoft/ToftWeb/
|
by: Dave |
last post by:
I have a page which uses JavaScript to create form elements using
document.createElement('input'), etc.. Both Firefox and IE have no
problem accomplishing this and when the form is submitted all...
|
by: SalamElias |
last post by:
I am creating several chkBoxes dynamically and assigning an event handler in
the Page_load as foillows
*****************************
Dim chkCatOption As CheckBox = New CheckBox
chkCatOption.Text...
|
by: webEater |
last post by:
Hello, I try the following in Firefox and other modern browsers:
window.addEventListener('load', function() {
document.title = CSS.getClass('fontSize');
var div = document.createElement('div');...
|
by: Narven |
last post by:
Hi,
I've been creating a script that dynamic loads js files.
but after creating that script, (and i use
document.createElement('script');) in that function.. i've realise that
the code that...
|
by: tswaters |
last post by:
Alright, so generally I'm using document.createElement("IMG").... but, I've noticed something just recently that made me switch to "new Image()"
What I'm doing is creating a photo gallery of...
|
by: emzipoo4u |
last post by:
Hi, I am creating an XML document with ASP (new to XML). I would like to know how do i add details to a tag e.g. i want to generate <Order xmlns="urn:www.badjda.org/schema/test_order_v3.00.xml">...
|
by: ShutterMan |
last post by:
I have a function that creates input buttons dynamically...
function $NEW_BUTTON(id, content, parentId, cssclass, onclick)
{
var ctrl = document.createElement("input");
ctrl.id = id;...
|
by: vunet |
last post by:
It is recommended by some sources I found to create IFrames in IE
using
document.createElement('<iframe src="#">')
instead of document.createElement('iframe').
Why and what browser versions to...
|
by: CloudSolutions |
last post by:
Introduction:
For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome former...
|
by: ryjfgjl |
last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
| |
