Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Basic parameter question

Status
Not open for further replies.

PeterPPSA

Programmer
Mar 29, 2011
8
US
Hi.

I have several radiobuttonlist objects in my asp.net page (.aspx), each with a button next to it. When the user clicks one of the buttons, the radiobuttonlist next to it clears. I am able to do this by creating a javascript function for each button/radiobuttonlist pair, but I can't seem to modify that function properly so that I have just one function with a parameter instead that gets called from each one of the buttons. Here is the function for a radiobuttonlist object called "rbl1:


function clearRadioButtonList1() {

var elementRef = document.getElementById('<%= rbl1.ClientID %>');
var inputElementArray = elementRef.getElementsByTagName('input');

for (var i = 0; i < inputElementArray.length; i++) {
var inputElement = inputElementArray;

inputElement.checked = false;
}
return false;
}

Can someone please show me how to change the function so that it uses a parameter and also what the call to the function should look like on the buttons?

Thanks for your help!
 
You'd need to send the identifier to the function so you can uniquely identify the correct radio button.

Code:
function clearRadioButtonList([red]radiobuttonID[/red]) {
[green]//Assuming the following line selects the radio button: 
var elementRef = document.getElementById('<%= rbl1.ClientID %>');
[/green]
var elementRef = document.getElementById([red]radiobuttonID[/red]);
elementRef.checked=false;
}

Now for your HTML

Code:
<input type=button onClick="clearRadioButtonList('<%= rbl1.ClientID %>');" value="Clear">

Assuming your ASP generates the radio buttons, each function call should get a unique radio button Id that you can use when its called.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Thanks. Still can't get it to work! Here's what I did:


function clearRadioButtonList(buttonID) {

var elementRef = document.getElementById(buttonID);
elementRef.checked = false;
}

And in the HTML:


<asp:Button runat="server" ID="ClearButton1" Text="Clear" OnClientClick="return clearRadioButtonList('<%= rbl1.ClientID %>');" />

Here's the error when I attempt to click the button:

It highlights the "elementRef.Checked = false;" statement and gives this error: "Microsoft JScript runtime error: "null" is null or not an object."

I get the same thing when I use my original function with the parameter as you describe.

Thanks for your continued help!
 
That means it can't find an element with that specific ID. Look at your resulting HTML code once the ASP has been parsed, and make sure the ID on the function matches the ID in the radio button being targeted.



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Thanks, Vacunita. Unfortunately, that didn't work either. I ran the app, did a view source, and saw that it put an "_0" at the end of the name. So, I changed the call to the function to include that, but I'm still getting the same error...

Amazing how complicated it turns out to be to do something so basic! But thanks, again. I do appreciate your help. ;)
 
What does the name have to do with this, You are using getElementById in which case your radio buttons need to have an ID.

The ID has to match the value in the function call.

Show me the resulting HTML code of a couple of the radio button pairs, I'll see if something looks wrong.

Code:
<input type=radio [red]id="radio001"[/red]>
<input type="button" onClick="return clearRadioButtonList('[red]radio001[/red]');">

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
What does the name have to do with this, you ask? I have no idea. I don't understand Javascript very well. I'm hoping to get answers here. Here is the code you wanted to see. Thanks for your continued help.


<div id="pnlFileNet" class="Panel">

<div class="PanelLeft">
<div class="Subheader">FileNet/WebXtra</div>
<br />
Select all libraries needed and list specific document access needed for each.
<br />
<br style="clear: both" />
<table border="0">
<tr>
<td colspan="3">
<u>Coporate One</u>
</td>
</tr>
<tr>
<td>
<input name="txtFileNetWebXtra1" type="text" id="txtFileNetWebXtra1" class="Data" />
</td>
<td>
<table id="rblFileNetWebXtra1" class="DataRadio" border="0" style="width:213px;">
<tr>
<td><input id="rblFileNetWebXtra1_0" type="radio" name="rblFileNetWebXtra1" value="ReadOnly" /><label for="rblFileNetWebXtra1_0">Read Only</label></td><td><input id="rblFileNetWebXtra1_1" type="radio" name="rblFileNetWebXtra1" value="ReadWrite" /><label for="rblFileNetWebXtra1_1">Read/Write</label></td>
</tr>
</table>
</td>
<td>
<input type="submit" name="ClearButton1" value="Clear" onclick="return clearRadioButtonList('&lt;%= rblFileNetWebXtra1_0.ClientID %>');" id="ClearButton1" />
</td>
</tr>
 
Here:

Code:
 <input type="submit" name="ClearButton1" value="Clear" onclick="return clearRadioButtonList('[red]&lt;%= rblFileNetWebXtra1_0.ClientID %>[/red]');" id="ClearButton1" />

That part of your ASP is not getting parsed correctly. It looks like the < has been replaced by its html entity equivalent:
&lt; So your ASP is just not being processed there. Which why the ID's do not match.




----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
OK, I see what you are saying. Here's what it looks like before the parsing:

<asp:Button runat="server" ID="ClearButton1" Text="Clear" OnClientClick="return clearRadioButtonList('<%= rblFileNetWebXtra1_0.ClientID %>');" />

Can you see anything wrong with this?
 
I'm not really versed in ASP, but as far as I can tell it looks correct.

Perhaps the forum333 may be of assistance.

From the Javascript side of things, its very straight forward. When using getElementByID your elements need to have ID's defined so the function can find them.

You are passing the ID of the radio button to the JS function so it can be used to find the appropriate object.


For instance, in this simple example you pass the ID or identifier of the text box you want cleared. The function takes that ID as a parameter and uses in the getElementById function to find the correct text box to manipulate:

Code:
<script type="text/javascript">

function clearTxtbox(txtBoxID){
var txtBoxObj=getElementById(txtBoxID);
txtBoxObj.value="";

}
</script>

<input type="text" id="textbox1">
<input type="text" id="textbox2">


<input type="button" onClick="clearTxtBox('textbox1');" value="Clear Text Box 1">

<input type="button" onClick="clearTxtBox('textbox2');" value="Clear Text Box 2">


Your ASP would be generating both the textboxes (radios in your case) and the buttons, passing to each the current ID in your loop.

What Javascript sees is the resulting HTML that is produced when your ASP has been parsed. Like with other server side languages the actual ASP code never reaches the client browser, only the resulting HTML.

Javascript then has access to the HTML to manipulate it, it never sees the ASP nor would it know what to do with it if it did see it.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top