Javascript cannot call element in array
Ok, let me explain more ... The goal is to check the box if there is a change in selection. Actual code:
function checkit(date)
{
document.forms[0].date.checked = true;
}
<input type="checkbox" name="date[]" value="2008-08-14">Aug 14, 2008<br>
<select name="slot[]" size="1" onchange="checkit(date[]);"/>
<option value="2008-08-15;0900;1700">9am to 5pm</option>
<option value="2008-08-15;1330;1730">1:30pm to 5:30pm</option>
</select>
<input type="checkbox" name="date[]" value="2008-08-15">Aug 14, 2008<br>
<select name="slot[]" size="1" onchange="checkit(date[]);"/>
<option value="2008-08-15;0900;1700">9am to 5pm</option>
<option value="2008-08-15;1330;1730">1:30pm to 5:30pm</option>
</select>
<input type="checkbox" name="date[]" value="2008-08-16">Aug 14, 2008<br>
<select name="slot[]" size="1" onchange="checkit(date[]);"/>
<option value="2008-08-15;0900;1700">9am to 5pm</option>
<option value="2008-08-15;1330;1730">1:30pm to 5:30pm</option>
</select>
In PHP, if it sees a variable with [], it automatically creates an array. In Javascript, I expected Javascript to recognize [] and execute it based on the current element. For example, if I select a value in the second checkbox, it should fire an event to validate that item. I don't want to call a variable like date1, date2, date3, date4 ... Hopefully this clears up more. I know I am missing something ... I tried the "this" keyword to make it "this current item" but it doesn't seem to work, but it could be that I was using the wrong syntax.
What I was expecting is an onchange event, it should fire its argument which is "date []", but I would suggest that Javascript should know which element in date [] it will use instead of calling it date [1] and soon. The checkit function gets the name "date []" and checks this flag [].
By the way, thanks a lot for the additional answers (I learned something new!)
source to share
This doesn't work because (as dreas said ) your HTML has errors and you are labeling your variables in a way that conflicts with the javascript syntax.
Your input name is date [1] , and [ and ] have special meaning in javascript code.
In this code:
document.forms[0].date.checked = true;
you try to access the first form of documents (document.forms [0]) and then you try to access a field named date , but there are none. According to your HTML markup, you have fields called "date [1]", "date [2]" and "date [3]".
But you cannot access like this:
document.forms[0].date[1].checked = true;
Why? Since date [1] is trying to index the date from 1 , in which case your date is not an array.
You can access if you enclose it in quotes:
document.forms[0]["date[1]"].checked = true;
Note that "date [1]" is now used as a string.
source to share
What exactly are you trying to do with this code?
As per your code snippet (which has some syntax errors) you check the checkbox and then call the js function which will check the checkbox again ...?
What exactly are you trying to achieve?
Try this code:
function checkit(date)
{
var date = document.getElementById(date);
date.checked = true;
}
<input type="checkbox" id="date[1]" value="2008-08-14" onchange="checkit('date[1]')");/>Aug 14, 2008<br />
<input type="checkbox" id="date[2]" value="2008-08-14" onchange="checkit('date[2]')");/>Aug 14, 2008<br />
<input type="checkbox" id="date[3]" value="2008-08-14" onchange="checkit('date[3]')");/>Aug 14, 2008<br />
source to share
PHP has the syntax arr[] = something
to put something at the next available index in an array.
Javascript doesn't have this syntax; if you want to put something at the next available index in the array use arr.push(something)
.
But the part of your example you're talking about is in HTML, not Javascript. Javascript refers to it, but the form fields themselves are created in HTML ... so you must provide its own name, not an auto-incrementing name.
If you dynamically generate HTML via DOM calls (for example, for each input element document.createElement('input')
, assign attributes and then appendChild()
to the main form), you can automatically name form fields ... but this is a whole different method of generating HTML and has a bunch of pitfalls for to watch out for.
source to share
First, you want to use a PHP specific function in Javascript. No, there is no such possibility, as far as I can tell.
Second, I would strongly advise against using HTML input names like "date [1]" ... it might be legal HTML (I need to try it in multiple browsers to make sure it is allowed), but it is almost 100% likely source of errors in the maintenance cycle.
I assume this code is either autogenerating for you or just wants to take a block and copy / paste it into your editor. If it is the former, I would call the elements "date_1" in autogenous code and be done with it. If the latter, then you can either store the number in your code (i.e. manually enter date_1 through date_257) or use Javascript document.write to generate HTML with less effort. I would ONLY do the latter (document.write out HTML) if there is no other way. If you are talking about 10-25 copies, handling this manually by hand is less likely to cause a problem than using document.write; if you have more than 25 such instances, it might make sense to automate element generation.
source to share