Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

click chekbox in repeated region to enable field for that one row

Posted on 2014-10-21
18
Medium Priority
?
132 Views
Last Modified: 2014-10-21
I have a repeated region with a checkbox and a textbox. The textbox is disabled by default, but if user checks the box for that one row then the text box for that one row should be enabled.

The checkbox name is:  
<input name="itemid" type="checkbox" id="itemid" value="<%=(PaymentLines.Fields.Item("Id").Value)%>">

The text field is:
<input name="amount" type="text" class="bodytext" id="amount" value="0" size="5" maxlength="10" disabled ="true">

As you can see it is disabled by default.

Checking the box should only enable the field for that particular row.

I tried using a script I have to disable a field and tweaking it but so far no luck.

I have:

<SCRIPT LANGUAGE="javaScript">
function disableme(first, second)
{
 ((first.checked == true)?second.disabled = true:second.disabled =  false );

 }
</SCRIPT>
0
Comment
Question by:Aleks
  • 11
  • 7
18 Comments
 

Author Comment

by:Aleks
ID: 40395351
Tried the following:

<SCRIPT LANGUAGE="javaScript">
function enableme(first, second)
{
 ((first.checked == true)?second.disabled = false:second.disabled =  true );

 }
</SCRIPT>

 <input name="itemid" type="checkbox" id="itemid" value="<%=(PaymentLines.Fields.Item("Id").Value)%>" onClick="enableme(document.form1.amount);" >

No luck so far
0
 

Author Comment

by:Aleks
ID: 40395359
Correction: This is the checkbox code:

<input name="itemid" type="checkbox" id="itemid" value="<%=(PaymentLines.Fields.Item("Id").Value)%>" onClick="enableme(document.form1.itemid,document.form1.amount);" >

I get no errors but the amount stays disabled when I check the box.
0
 
LVL 58

Expert Comment

by:Gary
ID: 40395363
Your function is expecting two parameters - you are only sending first
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:Aleks
ID: 40395369
I just updated but nothing happens. This is my current code:

Checkbox:

<input name="itemid" type="checkbox" id="itemid" value="<%=(PaymentLines.Fields.Item("Id").Value)%>" onClick="enableme(document.form1.itemid,document.form1.amount);" >

Text field:

  <input name="amount" type="text" class="bodytext" id="amount" value="0" size="5" maxlength="10" >

Script:

<SCRIPT LANGUAGE="javaScript">
function enableme(first, second)
{
 ((first.checked == true)?second.disabled = true:second.disabled =  false );

 }
</SCRIPT>
0
 
LVL 58

Expert Comment

by:Gary
ID: 40395373
With your corrected input onclick the code works fine

http://jsfiddle.net/Lgng2crr/
0
 
LVL 58

Expert Comment

by:Gary
ID: 40395374
Your logic is the wrong way round, should be

function enableme(first, second) {
    ((first.checked == true) ? second.disabled = false : second.disabled = true);
} 

Open in new window

0
 

Author Comment

by:Aleks
ID: 40395383
Works fine when not inside a repeat region. When inside of it doenst work, this is the code for my repeat region using the script above.

--- Code ---

  <%
 Dim RecordCounter
RecordCounter = 0
%>
                  <%
While ((Repeat1__numRows <> 0) AND (NOT PaymentLines.EOF))
%>
  <tr  <%
      RecordCounter=RecordCounter + 1
      If RecordCounter Mod 2 = 1 Then
            Response.Write("bgcolor=#FBFBFB")
      End If
      %>
      bgcolor="#FFFFFF" onMouseOver="this.style.backgroundColor='#FFFFCC'" onMouseOut="this.style.backgroundColor=''">
    <td width="10">&nbsp;</td>
    <td><div align="center">
      <input name="itemid" type="checkbox" id="itemid" value="<%=(PaymentLines.Fields.Item("Id").Value)%>" onClick="enableme(document.form1.itemid,document.form1.amount);" >
    </div></td>
    <td><table width="9" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="4"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
        <td width="2" height="14"><img src="../../Images/menus/separator.gif" alt="" /></td>
        <td width="10"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
      </tr>
    </table></td>
    <td><span class="bodytext"><%=(PaymentLines.Fields.Item("ItemDesc").Value)%></span></td>
    <td width="15" valign="middle"><table width="9" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="4"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
        <td width="2" height="14"><img src="../../Images/menus/separator.gif" alt="" /></td>
        <td width="10"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
        </tr>
    </table></td>
    <td class="bodytextreports" ><div align="right" class="bodytext"><%= FormatCurrency((PaymentLines.Fields.Item("PmtRecd").Value), 2, -2, -2, -2) %></div></td>
    <td width="17"><table width="12" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="4"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
        <td width="10" height="14"><img src="../../Images/menus/separator.gif" alt="" /></td>
        <td width="4"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
        </tr>
      </table>
      <div align="center"></div></td>
    <td width="81"  ><div align="right"><%= FormatCurrency((PaymentLines.Fields.Item("Balance").Value), 2, -2, -2, -2) %></div></td>
    <td ><table width="12" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="4"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
        <td width="10" height="14"><img src="../../Images/menus/separator.gif" alt="" /></td>
        <td width="4"><img src="../../Images/blank.gif" alt="" width="4" height="25" /></td>
        </tr>
      </table>
      <div align="center"></div></td>
    <td width="106" ><div align="center">$
      <input name="amount" type="text" class="bodytext" id="amount" value="0" size="5" maxlength="10" disabled>
    </div></td>
  </tr>
  <tr>
  <td colspan="11" background="../../Images/menus/separatortop.gif"><img src="../../Images/blank.gif" alt="" width="10" height="3"></td>
                </tr>
  <%
  Repeat1__index=Repeat1__index+1
  Repeat1__numRows=Repeat1__numRows-1
  PaymentLines.MoveNext()
Wend
%>

------
0
 
LVL 58

Expert Comment

by:Gary
ID: 40395399
Post the rendered HTML

Every input has the same name, you should give each one a unique name or ID - otherwise how is the code supposed to know which one to enable.
0
 

Author Comment

by:Aleks
ID: 40395429
I understand this, how can I do this ?  Say for example I use the id of the row to be added to both the checkbox and the amount ?

this is the id value:   <%=(PaymentLines.Fields.Item("Id").Value)%>

Right now the name is:
name="itemid"
name="amount"

what would the syntax be to append the id to the name so that it is unique ?
0
 

Author Comment

by:Aleks
ID: 40395433
I tried:

<input name="itemid<%=(PaymentLines.Fields.Item("Id").Value)%>" type="checkbox" id="<%=(PaymentLines.Fields.Item("Id").Value)%>" value="<%=(PaymentLines.Fields.Item("Id").Value)%>" onClick="enableme(document.form1.itemid,document.form1.amount);" >

and

<input name="amount<%=(PaymentLines.Fields.Item("Id").Value)%>" type="text" class="bodytext" id="amount" value="0" size="5" maxlength="10" disabled >

<SCRIPT LANGUAGE="javaScript">
function enableme(first, second) {
        ((first.checked == true) ? second.disabled = false : second.disabled = true);
    }
</SCRIPT>

I check the box .. nothing happens :#
0
 
LVL 58

Accepted Solution

by:
Gary earned 2000 total points
ID: 40395478
For your checkbox and input use this format

<input name="itemid" type="checkbox" data-id="item<%=(PaymentLines.Fields.Item("Id").Value)%>" value="<%=(PaymentLines.Fields.Item("Id").Value)%>" onClick="enableme(this,this.getAttribute('data-id'));">

<input name="amount" type="text" class="bodytext" id="item<%=(PaymentLines.Fields.Item("Id").Value)%>" value="0" size="5" maxlength="10" disabled="true">

Open in new window


For your javascript use this
<script>
function enableme(first, second) {
    first.checked == true ? document.getElementById(second).disabled = false : document.getElementById(second).disabled = true;
}
</script>

Open in new window

0
 

Author Comment

by:Aleks
ID: 40395489
There is a problem though. The values are passed on to the next page where an array is created from the comma delimited value that is passed under the name of 'itemid' ...
If I change the name it messes up the second page  : (  

Is there a way to enable the field without having to change the names ?
0
 
LVL 58

Expert Comment

by:Gary
ID: 40395502
I haven't changed the name
0
 

Author Comment

by:Aleks
ID: 40395519
How can I make it unique for the toggle to work without changing the name then ?
0
 
LVL 58

Expert Comment

by:Gary
ID: 40395533
Did you not see the code I posted above?
0
 

Author Comment

by:Aleks
ID: 40395540
I didn't my apologies, let me try it
0
 

Author Comment

by:Aleks
ID: 40395543
AWEEESOOOMEEE !!!  Thank you so much .. I am getting closer to finishing this page :)
0
 

Author Closing Comment

by:Aleks
ID: 40395546
:) !!!
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to implement server side field validation and display customized error messages to the client.
Ready to get certified? Check out some courses that help you prepare for third-party exams.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses

971 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question