asked on

Change Radio Button from 0 to 1 using Javascript Code

I am trying to change the value of a radio button which is bound to a small integer field in the database. The two scripts below work fine although do not implement this line when they run;

document.getElementById("x_InspectionActive").value = '0';

Open in new window

Please advise how I can get it to change the radio button control value on the form after the client button click event.
Complete code below.
My sample Button Code in Custom Attributes;

"/> <input type=""button"" value=""ARCHIVE"" onclick=""Archive();"" /"

Open in new window

//Javascript functions in EDIT Page - Client Scripts...
 function Archive()
 {                      
var now = new Date();
var strDateTime = [[AddZero(now.getDate()), AddZero(now.getMonth() + 1), now.getFullYear()].join("/"), [AddZero(now.getHours()), AddZero(now.getMinutes())].join(":"), now.getHours() >= 12 ? "PM" : "AM"].join(" ");
function AddZero(num) {
    return (num >= 0 && num < 10) ? "0" + num : num + "";   
}       
 var usr = ("<%= CurrentUserName %>");
 
 
 alert('This Inspection has been marked as ARCHIVED. This is the equivalent of deleting the row. This Inspection will not be available to the application, reports or specific queries.');
      document.getElementById("x_InspectionArchivedDate").value = strDateTime;
      document.getElementById("x_InspectionArchiverName").value = usr;   
      document.getElementById("x_InspectionActive").value = '0';   
 }   
 
 function UnArchive()      
 {                      
var strClear = "";
 
 alert('This Inspection has been marked as UNARCHIVED. Records from this Inspection should display in the application, reports or specific queries as long as it is also ACTIVE.');
      document.getElementById("x_InspectionArchivedDate").value = strClear;  
      document.getElementById("x_InspectionArchiverName").value = strClear;  
      document.getElementById("x_InspectionActive").value = '1';                                                       
 }

Open in new window

nmarun

function Archive() {
    document.getElementById("poBoxRadio").checked = true;
}

Open in new window

nmarun

Actually in your case:

document.getElementById("x_InspectionActive").checked=true;

Open in new window

XGIS

ASKER

Hello Nmarun..thankyou for your time... your proposed solution has been tested previously and it actually changes the state to no selection on either radio. Is there something else that may need to be addressed?

The code surrounding this control on the rendered page is....

<div id="tab_DMP_Sites_Inspections_4">
<table cellspacing="0" class="ewGrid" style="width: 100%"><tr><td class="ewGridContent">
<div class="ewGridMiddlePanel">
<table id="tbl_DMP_Sites_Inspectionsedit4" class="ewTable">

	<tr id="r_InspectionActive">
		<td class="ewTableHeader"><span id="elh_DMP_Sites_Inspections_InspectionActive"><table class="ewTableHeaderBtn"><tr><td>Active</td></tr></table></span></td>
		<td style="background-color: #D8E79D"><span id="el_DMP_Sites_Inspections_InspectionActive">
<div id="tp_x_InspectionActive" class="ewTemplate"><input type="radio" name="x_InspectionActive" id="x_InspectionActive" value="{value}" onclick= "alert('This selection turns off the complete Inspection Record to queries or reporting. The Site Inspection may be reactivated using this button.')" /></div>
<div id="dsl_x_InspectionActive" data-repeatcolumn="5" class="ewItemList">
<table class="ewItemTable"><tr><td>
<label><input type="radio" name="x_InspectionActive" id="x_InspectionActive" value="1" checked="checked" onclick= "alert('This selection turns off the complete Inspection Record to queries or reporting. The Site Inspection may be reactivated using this button.')" />Yes</label>
</td><td>
<label><input type="radio" name="x_InspectionActive" id="x_InspectionActive" value="0" onclick= "alert('This selection turns off the complete Inspection Record to queries or reporting. The Site Inspection may be reactivated using this button.')" />No</label>
</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr></table>
</div>
</span></td>

Open in new window

ASKER CERTIFIED SOLUTION

leakim971

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

hielo

I see three radio buttons with name="x_InspectionActive", but I believe you only need two.

My advice is get rid of the first one:
<input type="radio" name="x_InspectionActive" id="x_InspectionActive" value="{value}" onclick= "alert('This selection turns off the complete Inspection Record to queries or reporting. The Site Inspection may be reactivated using this button.')" />

Then change/update the id attribute of the remaining two radio buttons as follows:
<input type="radio" name="x_InspectionActive" id="x_InspectionActive_Yes" value="1" ...>
<input type="radio" name="x_InspectionActive" id="x_InspectionActive_No" value="0" ...>

Lastly, on your javascript, instead of:
document.getElementById("x_InspectionActive").value = '0';

use:
document.getElementById("x_InspectionActive_No").checked =true;

Likewise, instead of:
document.getElementById("x_InspectionActive").value = '1';

use:
document.getElementById("x_InspectionActive_Yes").checked =true;

XGIS

ASKER

Thankyou for all contributions...but leakim971 nailed it..again, This is a rendered page which has limited options for simple modification.

It works much better now and succesfully checks the 'yes' radio which = 1

In the case of the seperate 'no' radio it does not check and both radios become unchecked.

This works in this case as the queries/views are filtered on the value 1.