My Javascript delete code is not working. Error "TypeError: checkBox is undefined @ javascripts/js/delete.js:5"

Question

I cannot figure out why this isn't working, it was working fine last week and now it isn't. I figured I must have mistakenly changed something, but after going over the whole thing, I couldn't find anything. So, I'm wondering now if my code wasn't very good in the first place. Here is the delete.js file:

function deleterecord(form)
    {

    var checkBox = document.edit.checkbox;
    var lenBox = checkBox.length;
    var foundBox = false;

    while( lenBox--> 0 )
        {
            if( checkBox[lenBox].checked === true )
                {
                    foundBox = true;
                    break;
                }
        }

    if( !foundBox )
        {
        alert("Please select a record to delete");
        return;
        }

    var r=confirm("Once deleted, these records are gone forever.\n\n Are you SURE you want to proceed? ");
    if (r==true)
        {
        form.submit();
        }
    else
        {
        alert("Phew! That was close!\n\n No records were deleted.");
        window.location.reload(true);
        }
    return;
    }

...and here is the html form:

<form action="process_delete.php" method="post" id="edit" name="edit">
<table cellpadding="4px" cellspacing="2px" border="1">

    <tr align="center">
    <td>Aircraft Reg</td>
    <td>Date Installed</td>
    <td>Prefix</td>
    <td>Part Number</td>
    <td>Flight Control</td>
    <td>Lat Position</td>
    <td>Long Position</td>
    <td>Vert Position</td>
    <td>Location</td>
    <td>Material</td>
    <td>OEM/PMA</td>
    <td>Select</td> 
    </tr>

    $result = mysql_query("SELECT * FROM installed $filter ORDER BY aircraft_reg , part_number, date_installed ASC");
    $pagerow = mysql_num_rows($result);
        if ($pagerow > 0 ) 
            {
            while($row = mysql_fetch_array($result))
                {
                echo "<tr>";
                echo "<td>" . $row['aircraft_reg'] . "</td>";
                echo "<td>" . $row['date_installed'] . "</td>";
                echo "<td>" . $row['prefix'] . "</td>";
                echo "<td>" . $row['part_number'] . "</td>";
                echo "<td>" . $row['flight_control'] . "</td>";
                echo "<td>" . $row['lat_position'] . "</td>";
                echo "<td>" . $row['long_position'] . "</td>";
                echo "<td>" . $row['vert_position'] . "</td>";
                echo "<td>" . $row['location'] . "</td>";
                echo "<td>" . $row['material'] . "</td>";
                echo "<td>" . $row['oempma'] . "</td>";
                echo "<td align=\"center\"><input type=\"checkbox\" selected=\"\" id=\"checkbox\" name=\"check_list[]\" value=\"" . $row['id'] . "\"></td>";
                echo "</tr>";
                }
            echo "<tr align=\"center\">";
            echo "<td colspan=\"12\"><input type=\"button\" value=\"Delete Selected\"  style=\"width:150px; height:30px;\" onClick=\"deleterecord(form)\"></td>";
            echo "</tr>";
            }
        else
            {
            echo "<tr><td align=\"center\" colspan=\"12\"><h2>No Records To Display</h2></td></tr>";
            }   
    </table>

</form>

I have tried different variations of the document.edit.checkbox; such as document.getElementById["edit"].checkbox; or document.getElementById["checkbox"]; but I'm not able to get it working. Here is a jsfiddle if that helps, and I removed the php bits and entered some sample values instead. As you can probably tell I'm very new to Javascript, but I'm trying my best and would really appreciate any guidance you could provide.

Thanks @epoch for the edit, I didn't know until now where the ` key was :) — Andrew Fox
– Andrew Fox, Commented Oct 14, 2012 at 11:25

epoch · Accepted Answer · 2012-10-14 10:40:59Z

2

You want to loop trough all checkbox elements, so you need to get them by their name:

var checkBox = document.getElementsByName('check_list[]');

Here is the updated fiddle

answered Oct 14, 2012 at 10:40

epoch

16.7k5 gold badges50 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Andrew Fox Over a year ago

That totally fixed it, thank you so much! Just so I can get closure on this, do you have any idea how this would have worked before? I haven't changed that document.edit.checkbox line since I first made the script...it just doesn't make sense to me. Is there a way that could have worked?

epoch Over a year ago

Not as far as I know unfortunately

Collectives™ on Stack Overflow

My Javascript delete code is not working. Error "TypeError: checkBox is undefined @ javascripts/js/delete.js:5"

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related