Meaningless Drivel is fun!*
The moose likes HTML, CSS and JavaScript and the fly likes enable/disable textbox Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "enable/disable textbox" Watch "enable/disable textbox" New topic
Author

enable/disable textbox

Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Hi,

I have 2 rows in my table. One is multibox of products and other is Quantity. I have kept the quantity text box disabled by default.

What i want is : when i click on the multibox the corresponding quantity text box must get enabled.

I have tried : document.forms[0].quantity.disabled=false; but its not working.

Here is my code:


<logic:iterate id="Challan" name="Challan">
<tr>
<td >
<html:multibox name="Challan" property="checkedProducts" onclick="enableThis();">
<bean:write name = "Challan" property="products" />
</html:multibox>  <bean:write name = "Challan" property="products" />
</td>
<td >
<html:text name = "Challan" property="quantity" size="10" disabled="true"/>
</td>
</tr>
</logic:iterate>


function:
function enableThis()
{
alert("");
document.forms[0].quantity.disabled=false;
}

Please help.

Shahid Shaikh
Greenhorn

Joined: Mar 02, 2009
Posts: 7
Deeps Mistry wrote:Hi,

I have 2 rows in my table. One is multibox of products and other is Quantity. I have kept the quantity text box disabled by default.

What i want is : when i click on the multibox the corresponding quantity text box must get enabled.

I have tried : document.forms[0].quantity.disabled=false; but its not working.

Here is my code:


<logic:iterate id="Challan" name="Challan">
<tr>
<td >
<html:multibox name="Challan" property="checkedProducts" onclick="enableThis();">
<bean:write name = "Challan" property="products" />
</html:multibox>  <bean:write name = "Challan" property="products" />
</td>
<td >
<html:text name = "Challan" property="quantity" size="10" disabled="true"/>
</td>
</tr>
</logic:iterate>


function:
function enableThis()
{
alert("");
document.forms[0].quantity.disabled=false;
}

Please help.




Hi Deeps,
You can try it out by assigning ID to u'r field and then trying this code

<html:text name = "Challan" property="quantity" id="id_1" size="10" disabled="true"/>

Just modify the function like this


function enableThis()
{
alert("");
//document.forms[0].quantity.disabled=false;
document.getElementById('id_1').disabled=false;
}


Hope this helps you

Cheers ....


Shahid.
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Why showing us code with JavaScript, it is usually beter to show the generated source code and not the serverside markup.

Eric
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Shahid Shaikh wrote:
Deeps Mistry wrote:Hi,


Hi Deeps,
You can try it out by assigning ID to u'r field and then trying this code





Hey Shahid,

'id' attribute is not valid for <html:text> . Can you please any other way?

Thanks for your help.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60782
    
  65

Shahid Shaikh wrote:You can try it out by assigning ID to u'r field and then trying this code

Please use real words when posting to the forums. Abbreviations such as "u'r" in place of "your" only serve to make your posts more difficult to read and less likely to generate useful responses.

Please read this for more information.

thanks,
bear
JavaRanch sheriff


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Deeps Mistry wrote:Hi,

I have 2 rows in my table. One is multibox of products and other is Quantity. I have kept the quantity text box disabled by default.

What i want is : when i click on the multibox the corresponding quantity text box must get enabled.

I have tried : document.forms[0].quantity.disabled=false; but its not working.

Here is my code:


<logic:iterate id="Challan" name="Challan">
<tr>
<td >
<html:multibox name="Challan" property="checkedProducts" onclick="enableThis();">
<bean:write name = "Challan" property="products" />
</html:multibox>  <bean:write name = "Challan" property="products" />
</td>
<td >
<html:text name = "Challan" property="quantity" size="10" disabled="true"/>
</td>
</tr>
</logic:iterate>


function:
function enableThis()
{
alert("");
document.forms[0].quantity.disabled=false;
}

Please help.



Please help me out. I am stuck. Cannot do anything further.
Shahid Shaikh
Greenhorn

Joined: Mar 02, 2009
Posts: 7
Deeps Mistry wrote:
Shahid Shaikh wrote:
Deeps Mistry wrote:Hi,


Hi Deeps,
You can try it out by assigning ID to u'r field and then trying this code





Hey Shahid,

'id' attribute is not valid for <html:text> . Can you please any other way?

Thanks for your help.




Hey Deeps ,
You can try out "styleId" attribute it is Identifier to be assigned to this HTML element (renders an "id" attribute). Please try this and see if it is helpfull


Cheers
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Shahid Shaikh wrote:
Deeps Mistry wrote:
Shahid Shaikh wrote:
Deeps Mistry wrote:Hi,


Hi Deeps,
You can try it out by assigning ID to u'r field and then trying this code





Hey Shahid,

'id' attribute is not valid for <html:text> . Can you please any other way?

Thanks for your help.




Hey Deeps ,
You can try out "styleId" attribute it is Identifier to be assigned to this HTML element (renders an "id" attribute). Please try this and see if it is helpfull


Cheers


Hey ,

Style id is working javascript:emoticon('');. But the problem is that only the first row is getting enabled.

As i explained earlier, i have two columns and the no of rows depends on the data. So i am using < logic:iterate > to iterate over the data. In this case what should i do?

Also i am using multibox.

Do you have any idea on this?

Thanks for your timely help.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60782
    
  65

Please learn to use the quote tag correctly. New replies should go outside any quote tag.
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Hey ,

Style id is working javascript:emoticon('');. But the problem is that only the first row is getting enabled.

As i explained earlier, i have two columns and the no of rows depends on the data. So i am using < logic:iterate > to iterate over the data. In this case what should i do?

Also i am using multibox.

Do you have any idea on this?

Thanks for your timely help.






Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Deeps Mistry wrote:Hey ,

Style id is working javascript:emoticon('');. But the problem is that only the first row is getting enabled.

As i explained earlier, i have two columns and the no of rows depends on the data. So i am using < logic:iterate > to iterate over the data. In this case what should i do?

Also i am using multibox.

Do you have any idea on this?

Thanks for your timely help.








Can anyone please help me out on this.
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
As I mentioned on March 3rd, show us the generated source.

Eric
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Eric Pascarello wrote:As I mentioned on March 3rd, show us the generated source.

Eric


The generated code is as follows:

Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Looks to me it is the same problem as here: http://www.coderanch.com/t/434945/HTML-JavaScript/javascript-function-not-being-called

Why the two threads?

Eric
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Also USE CODE TAGS please. Makes it easier to read.
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Eric Pascarello wrote:Also USE CODE TAGS please. Makes it easier to read.


Hi,

They are not the same issues.
My first issue was regarding javascript function not being called. By second issue is regarding multibox and text box enable/disable which i believe is different from the first.Hence the two post.

Please help me out ranchers.

Thanks.
Saifuddin Merchant
Ranch Hand

Joined: Feb 08, 2009
Posts: 597

Deeps,

You problem is a bit complicated. Let me see if I get the explanation right.

1. You generate a number of rows and you need to enable a textbox in a row depending on the selected box clicked for that row!

2. One thing that you have wrong in you 'jsp' code is that you are assigning the same styleId to all the quantity boxes. This means that all the quantity boxes in your page have the same Id which is incorrect! So the first thing that you will have to correct is generate a unique styleId for each textbox.

3. In your Java script function instead of document.getElementById('id_1').disabled=false; you would write something like this,
Of course the most difficult part out here is getting the Row Id,

4. You call the enable function with a parameter this.value --> onclick="enableThis(this.value). While this could help you with the alert to display which value was selected in the multibox, it gives no information regarding the row.
What you need here instead is something like

Combine this with step 3 and you got what you looking for.

5. There is an easier way to do all this, but you'll need to be using Jquery! (I sometimes do wonder how JS could be written without it!!) -- Then you could use DOM manipulation to get this to work in a much easier manner. maybe not the most correct - but definitely a lot easier.

Hope this answer helped. its complicated - but then so is what you are trying to achieve.

Cheers - Sam.
Twisters - The new age Java Quiz || My Blog
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Sam Mercs wrote:Deeps,

You problem is a bit complicated. Let me see if I get the explanation right.

1. You generate a number of rows and you need to enable a textbox in a row depending on the selected box clicked for that row!

2. One thing that you have wrong in you 'jsp' code is that you are assigning the same styleId to all the quantity boxes. This means that all the quantity boxes in your page have the same Id which is incorrect! So the first thing that you will have to correct is generate a unique styleId for each textbox.

3. In your Java script function instead of document.getElementById('id_1').disabled=false; you would write something like this,
Of course the most difficult part out here is getting the Row Id,

4. You call the enable function with a parameter this.value --&gt; onclick=&quot;enableThis(this.value). While this could help you with the alert to display which value was selected in the multibox, it gives no information regarding the row.
What you need here instead is something like

Combine this with step 3 and you got what you looking for.

5. There is an easier way to do all this, but you'll need to be using Jquery! (I sometimes do wonder how JS could be written without it!!) -- Then you could use DOM manipulation to get this to work in a much easier manner. maybe not the most correct - but definitely a lot easier.

Hope this answer helped. its complicated - but then so is what you are trying to achieve.


Hey,
I have tried a similar thing.

<%int ids = 1; %>
<logic:iterate id="Challan" name="Challan">
<tr>
<td >
<html:multibox name="Challan" property="checkedProducts" styleId="multi_box" onclick="enableThis(<%=ids %>);">
<bean:write name = "Challan" property="products" />
<bean:write name="Challan" property="delimiter" />
<bean:write name = "Challan" property="quantity" />
<bean:write name="Challan" property="delimiter" />
<bean:write name="Challan" property="unit" />
</html:multibox>  <bean:write name = "Challan" property="products" />
</td>
<td >

<html:text name = "Challan" property="quantity" styleId='<%="qty" + ids%>' size="6" disabled="true" />
</td>
</tr>
<%
ids++;
%>

</logic:iterate>

But my problem lies in passing the 'ids' variable to javascript function.

Please help me out.
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189




Hey, I got the solution

I was successful in finding the rownumber
This is what i did:


function enableThis(checkedStr)
{
var par=checkedStr.parentNode;
while(par.nodeName.toLowerCase()!='tr')
{
par=par.parentNode;
}
alert(par.rowIndex);

for(var i = 0;i&amp;lt;document.forms[0].checkedProducts.length;i++)
{
if(document.forms[0].checkedProducts[i].checked)
{
var ids = &quot;qty&quot;+ par.rowIndex;
document.getElementById(ids).disabled = false;
}

}
}

Its working fine. But now when i uncheck it, it should get disabled. This is not happening.
Any clues for this?

Thanks&amp;gt;
Saifuddin Merchant
Ranch Hand

Joined: Feb 08, 2009
Posts: 597

Yep there should be a simple solution - but it would help if you post what you are trying out.

A solution that I could think of is putting a else out here and disabling the check box.

I must admit though that i don't understand your code. For e.g. whats the for loop doing?

I guess I need to look at the entire page to really understand what is happening. But as long as its doing what you want I guess that's fine
Deeps Mistry
Ranch Hand

Joined: Jan 31, 2009
Posts: 189
Sam Mercs wrote:Yep there should be a simple solution - but it would help if you post what you are trying out.




Hey,
There indeed is a simple solution to my problem and here is the solution:

<html:multibox name="Challan" property="checkedProducts" styleId="multi_box" onclick="enableThis(this);"> </html:multibox>

function enableThis(checkedStr)
{
var par=checkedStr.parentNode;

while(par.nodeName.toLowerCase()!='tr')
{
par=par.parentNode;
}
qty = "qty"+ par.rowIndex; //to fetch the rowNumber as you'd mentioned.

document.getElementById(qty).disabled = !(checkedStr.checked); // enable/disable text box depending on checked/unchecked multibox.
}


Thanks a lot for your help.
 
wood burning stoves
 
subject: enable/disable textbox
 
Similar Threads
pass a variable in the URl
multibox error
multibox formating
Multibox Not Populating as Checked!!!
multibox query