DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

+ Reply to Thread
Results 1 to 2 of 2

Hybrid View

  1. #1
    Join Date
    Oct 2006
    Posts
    1

    JavaScript IE radio button problems

    Hi all,

    I have a small script that allows a user to toggle a line of radiobuttons. The script works perfectly in both Firefox and Opera, IE simply doesn't work.

    The problem lies in the following statement:

    Code:
            function selectAll (dateIndicator, status)
            {
                    form = document.forms['nmts'];
                    for (var i=1; i<=50; i++)
                    {
                            var radioButtonId = "" + dateIndicator + i;
                            if (form.elements [radioButtonId])
                            {
                                    form.elements[radioButtonId][status].checked = true;
                            }
                    }
            }
    There are actually two problems in this code. The
    form.elements [radioButtonId] apparently doesn't work to get to the appropriate element in the elements array. This can be bypassed by an additional loop (aarrghhh) over all elements and a check for the elements name agains the radioButtonId.

    However, when I get to the correct element, all radios with the same name, but a different value are seen as one...

    Anyone and ideas on how to fix this problem?
    Thanks.

    Full code of the page (quite a bit, apologies for that):

    Code:
    <html>
    <head>
        <title>Test</title>
        <script type="text/javascript">
        <!--
            function selectAll (dateIndicator, status)
            {
                    form = document.forms['nmts'];
                    for (var i=1; i<=50; i++)
                    {
                            var radioButtonId = "" + dateIndicator + i;
                            if (form.elements [radioButtonId])
                            {
                                    form.elements[radioButtonId][status].checked = true;
                            }
                    }
            }
        //-->
        </script>
    </head>
    
    <body>
    <form name="nmts" method="post" action="/AllowForbid/updateNMTs.do">
    <table border="1" cellpadding="5" cellspacing="0">
    <tbody>
        <tr bgcolor="#cccccc">
            <td>Date</td>
            <td>&nbsp;</td>
            <td>2</td><td>3</td>
        </tr>
    
        <tr bgcolor="#eeeeee">
            <td bgcolor="#eeeeee" valign="top">2003-10-01</td>
            <td>
                <table border="0" cellpadding="0" cellspacing="0">
                    <tbody><tr>
                        <td>
                            <a href="javascript:selectAll('2003-10-01', 0)"><img src="test_files/agt_action_fail.png" alt="[no data]" border="0"></a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="javascript:selectAll('2003-10-01', 1)"><img src="test_files/gg_connecting.png" alt="[unavailable]" border="0"></a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="javascript:selectAll('2003-10-01', 2)"><img src="test_files/agt_action_success.png" alt="[ok]" border="0"></a>
                        </td>
                    </tr>
                </tbody></table>
            </td>
            <td>
                <input id="2003-10-012" name="2003-10-012" value="2"
                type="radio"><br><input
                id="2003-10-012" name="2003-10-012" value="3"
                type="radio"><br><input
                id="2003-10-012" name="2003-10-012" value="1" checked="checked"
                type="radio">
            </td>
            <td>
                <input id="2003-10-013" name="2003-10-013" value="2"
                type="radio"><br><input
                id="2003-10-013" name="2003-10-013" value="3"
                type="radio"><br><input
                id="2003-10-013" name="2003-10-013" value="1" checked="checked"
                type="radio">
            </td>
        </tr>
        <tr bgcolor="#ffffff">
            <td bgcolor="#eeeeee" valign="top">2003-10-02</td>
            <td>
                <table border="0" cellpadding="0" cellspacing="0">
                    <tbody><tr>
                        <td>
                            <a href="javascript:selectAll('2003-10-02', 0)"><img src="test_files/agt_action_fail.png" alt="[no data]" border="0"></a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="javascript:selectAll('2003-10-02', 1)"><img src="test_files/gg_connecting.png" alt="[unavailable]" border="0"></a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="javascript:selectAll('2003-10-02', 2)"><img src="test_files/agt_action_success.png" alt="[ok]" border="0"></a>
                        </td>
                    </tr>
                </tbody></table>
            </td>
            <td>
                <input id="2003-10-022" name="2003-10-022" value="2"
                type="radio"><br><input
                id="2003-10-022" name="2003-10-022" value="3"
                type="radio"><br><input
                id="2003-10-022" name="2003-10-022" value="1" checked="checked"
                type="radio">
            </td>
            <td>
                <input id="2003-10-023" name="2003-10-023" value="2"
                type="radio"><br><input
                id="2003-10-023" name="2003-10-023" value="3"
                type="radio"><br><input
                id="2003-10-023" name="2003-10-023" value="1" checked="checked"
                type="radio">
            </td>
        </tr>
    </tbody></table>
    <input value="Submit" type="submit">
    </form>
    </body></html>

  2. #2
    Join Date
    Mar 2005
    Posts
    21
    Try following script:
    <!--
    function selectAll (dateIndicator, status)
    {
    form = document.forms['nmts'];
    for (var i=1; i<=50; i++)
    {
    var radioButtonId = "" + dateIndicator + i;
    //if (form.elements [radioButtonId])
    //{
    document.getElementById(radioButtonId).setAttribute("Checked","true");
    //}
    }
    }
    //-->
    Innovation Makes Life Better.

Similar Threads

  1. radio button inside datagrid
    By Balaji N.S in forum .NET
    Replies: 3
    Last Post: 02-17-2007, 02:36 PM
  2. Replies: 0
    Last Post: 02-10-2006, 10:15 AM
  3. problems with javascript
    By Michael in forum ASP.NET
    Replies: 10
    Last Post: 11-08-2005, 12:19 PM
  4. Replies: 2
    Last Post: 04-28-2005, 09:31 AM
  5. Replies: 0
    Last Post: 10-11-2002, 01:16 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


Top DevX Stories

Easy Web Services with SQL Server 2005 HTTP Endpoints
JavaOne 2005: Java Platform Roadmap Focuses on Ease of Development, Sun Focuses on the "Free" in F.O.S.S.
Wed Yourself to UML with the Power of Associations
Microsoft to Add AJAX Capabilities to ASP.NET
IBM's Cloudscape Versus MySQL


Sponsored Links