asked on

Enabling/Disabling form elements with Struts 2 tags

I'm trying to make a script to enable a Submit button (disabled by default) inside a <s:form> tag. This would be achieved by selecting two different radio buttons (iterated and displayed with the Display tag library in 2 different tables) and selecting a choice other than the default one from a drop down list.

I've been able to implement scripts to do this using the standard HTML form tag but referencing the <s:form> doesn't work (it throws an error saying that it can't find the element). I'm trying to do something in the style of 'document.formName.sendData.disabled=false;' but i keep getting this error. The same happens when I use 'document.forms[0].sendData.disabled=false;'
Switching to other method like 'document.getElementById('sendData').disabled(false);' doesn't throw this error but it doesn't seem to work.

I'm calling to the function from the iterated radio buttons (printed as <input type="radio" ...> by iterating a list via Displaytag) and from the drop down menu (as a <s:select ...> type), and calling to the function using 'onClick="functionChecked()"'. Also I'm trying to make it work both on Firefox and IE6.

Any idea on how to do this? any suggestion that works even for a single group of radio buttons would be great (since I haven't been able to even make that work, and I could go from there for the rest. Thanks in advance.

Gurvinder Pal Singh

Problem description is detailed but please post your source code.

Reddoxx

ASKER

Of course. Here's some basic code for what I'm trying to do.

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib uri="http://displaytag.sf.net" prefix="display"%>
<HTML>
<HEAD>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<script type="text/javascript"> 
	function checkifempty()
	{
		document.select.Send.disable = false;
	}
</script> 
</HEAD>
<BODY>
	<s:form id="select" name="select" action="save"
		theme="simple">
 
	<display:table name="data" id="row" class="displayTagTable"  requestURI="">
		<display:column title=""><input type="radio" name="id" id="${row.id}" value="${row.id}" onClick="checkifempty()"/> </display:column>  
	</display:table>
 
<input type="submit" name="Send" value="Send" id="Send"/>
</s:form>
</BODY>
</HTML>

Open in new window

Reddoxx

ASKER

Found what I was doing wrong.
I should have used 'document.getElementById('Send').disabled = false;'.

The main differences from my previous tries is using "disabled" instead of "disable". With this out of the way, getElementById('Send') worked fine on both IE and Firefox by calling the function from the radio button tag. For the <s:select> it was pretty much the same but changing 'onClick' for 'onChange', checking if the default value was selected or not and disabling or enabling according to this. Also for reference I forgot to add the "disabled="true" on the submit button from my previous example.

I still have another doubt related to this. Is there any way to disable a whole group of textfields in a form (also using Struts 2 tags) without disabling and enabling them one by one? I tried getting them using a 'form.getElementsByTagName('s:textfield')' and of course this didn't work. Also since every textfield uses different names and ids, theres no way to use according functions to reference them in the script without working one by one. Any idea on how could I be able to do this?

Thanks in advance.

ASKER CERTIFIED SOLUTION

Gurvinder Pal Singh

membership

This solution is only available to members.

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

Start Free Trial

Reddoxx

ASKER

Thanks a lot. That worked just fine. Also, it looks like a lot of my problems came from me misunderstanding the purpose of Struts 2 tags. Javascript procedures like 'form.getElementsByTagName' still work by referencing tags as they would be generated by Struts. Struts 2 tags work server side, but Javascript works client side. Still, Struts tags generate standard HTML code.
For example, the tag <s:textfield>, generates a tag <input type='text'> client side. So I can pretty much use any JavaScript function by referencing the final generated tags.
Thanks again