ajax call to load url to div does not envoke default checks in radio button

[Kris_2]

Hello,

I'm relatively new to php and ajax. I'm missing a key concept I think, which is causing my unexpected result.

I have a php pure css navbar. User selects menu item, which is a button that launches javascript

 <script>
 function loadXMLDoc(yearurl)
 {
  var xmlhttp;
  if (window.XMLHttpRequest) // code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
  else // code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  xmlhttp.onreadystatechange=function()
  {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     document.getElementById("elps_mainbox").innerHTML=xmlhttp.responseText;
  }
  xmlhttp.open("GET",yearurl,true);
  xmlhttp.send();
 }
 </script>

I pass to loadXMLDoc a php url that contains several variables including itog=[0 or 1]. The response goes to div element ELPS_MAINBOX. In the URL php code are two radio buttons:

 if ($itog==0)
 {
  printf("<input type=\"radio\" name=\"chk1\" id=\"Ellipse\" onclick=\"loadXMLDoc('".
         "show_data_stat.php".
         "?stat=%s&year=%4.4d&intf=%d&itog=0')\" checked=\"checked\"/>\n",$stat,$year,$intf);
  printf("<input type=\"radio\" name=\"chk1\" id=\"Uptime\" onclick=\"loadXMLDoc('".
         "show_data_stat.php".
         "?stat=%s&year=%4.4d&intf=%d&itog=1')\"/>\n",$stat,$year,$intf);
 }
 else
 {
  printf("<input type=\"radio\" name=\"chk1\" id=\"Ellipse\" onclick=\"loadXMLDoc('".
         "show_data_stat.php".
         "?stat=%s&year=%4.4d&intf=%d&itog=0')\"/>\n",$stat,$year,$intf);
  printf("<input type=\"radio\" name=\"chk1\" id=\"Uptime\" onclick=\"loadXMLDoc('".
         "show_data_stat.php".
         "?stat=%s&year=%4.4d&intf=%d&itog=1')\" checked=\"checked\"/>\n",$stat,$year,$intf);
  }

The expected behavior is that when itog=0 (defined initially by the navbar menu selection), Ellipses checkbox is checked. When itog=1, Uptime checkbox is checked instead. Once the page is loaded, the user should be able to check one of these radio buttons. When one is checked, this URL should reload displaying new div content.

What happens instead are two things:
1: when the user selects the menu item, the radio buttons are displayed, but neither is checked. The rest of the div content is displayed fine.
2: when the user selects a radio button, the div content changes as expected (itog is being interpreted correctly by the rest of the php code), but the radio buttons do not retain their check and both are unchecked again. It is as if the "checked=checked" property is not visible to the browser.

Can anyone explain to me what I'm missing?

Thank you,
Kris

[Kris_2]

I have posted this to the AJAX/DHTML forum, since I think that is probably a better place for it.

[JorgeM]

Please, only post your thread once. I will move this thread to the JavaScript forum category for you. You can always click on "flag bad post" in the future to get a moderator's attention.

thank you.

[Kris_2]

To answer my own question, I was not able to figure this out. But a workaround to abandon radio buttons and use <button type=buttons> instead, passing the function call and vars with onclick.