admin管理员组文章数量:1391787
I have a label control with in a form view that displays the sum of few textboxes. I am not able to get the id of label tb_TA_2_6 in java script.
i tried
<script type ="text/jscript" language= "javascript" >
function autosum(t1, t2) {
var sum;
var a = document.getElementById('tb_TA_2_6'); // does not work
var b = FindControl(FormView1, t2); // does not work
var c = <%= 'tb_TA_2_6'.ClientID%>; // unknown ponent tb_TA_2_6
var c = <%= tb_TA_2_6.ClientID%>; //The name 'tb_TA_2_6' does not exist in the current context
var num2 = $(t2);
if (num2.textContent)
sum = num2.textContent;
else if (num2.innerText)
sum = num2.innerText;
else
sum = num2.innerHTML;
}
function FindControl(parentControl, strId)
{
var returnObject;
for(i=0;i < parentControl.elements.length; i++)
{
if(parentControl.elements[i].id.indexOf(strId) >= 0)
returnObject = parentControl.elements[i];
else if(parentControl.elements[i].hasChildNodes())
returnObject = FindControl(parentControl.elements[i],strId);
if(returnObject != null)
{ //if object is found return
return returnObject;
}
}
return returnObject;
}
</script>
but none of it seems to work, does anyone has an idea what's going on with the label with id tb_TA_2_6.
The form view looks like
<asp:FormView ID="FormView1" runat="server" ClientIDMode="Static">
<ItemTemplate>
<asp:Label ID="labelID" runat="server" Text='<%#Bind("ID") %>' Visible="false"></asp:Label>
<table id="table1">
<tr>
<td>
<span > Textbox1 </span>
</td>
<td>
<asp:TextBox ID="tb_TA_2_4" onBlur="Javascript:autosum(this, '<%= tb_TA_2_6.ClientID%>');" runat="server" Text='<%#Bind("question6i","{0:$#,#0.00}") %>'></asp:TextBox>
</td>
</tr>
<tr>
<td>
<span>6. (iii) Total Value </span>
</td>
<td>
<asp:Label ID="tb_TA_2_6" runat="server" ReadOnly="true" Text='<%#Bind("question6iii", "{0:$#,#0.00}") %>' OnPreRender="FormView1_PreRender" ></asp:Label>
</td>
</tr>
</table>
</ItemTemplate>
html rendered is like following, I removed the style information in my question.
<tr>
<td style="vertical-align: middle; width: 697px; height: 15px; border-style: solid;
border-color: #6699cc; border-width: 1px; border-top: 1px solid #fff;">
<span style="font-family: MS Sans Serif; font-size: 14px; color: #000000">6. (iii) Total
Value of All Benefits For Payment of Utilities </span>
</td>
<td class="alignright" style="vertical-align: top; width: 157px; height: 15px; border-style: solid;
border-color: #6699cc; border-width: 1px; border-left: 1px solid #fff; border-top: 1px solid #fff;">
<span id="ctl00_cph_Main_FormView1_tb_TA_2_6" ReadOnly="true" style="font-size:12pt;">$60.00</span>
</td>
</tr>
I have a label control with in a form view that displays the sum of few textboxes. I am not able to get the id of label tb_TA_2_6 in java script.
i tried
<script type ="text/jscript" language= "javascript" >
function autosum(t1, t2) {
var sum;
var a = document.getElementById('tb_TA_2_6'); // does not work
var b = FindControl(FormView1, t2); // does not work
var c = <%= 'tb_TA_2_6'.ClientID%>; // unknown ponent tb_TA_2_6
var c = <%= tb_TA_2_6.ClientID%>; //The name 'tb_TA_2_6' does not exist in the current context
var num2 = $(t2);
if (num2.textContent)
sum = num2.textContent;
else if (num2.innerText)
sum = num2.innerText;
else
sum = num2.innerHTML;
}
function FindControl(parentControl, strId)
{
var returnObject;
for(i=0;i < parentControl.elements.length; i++)
{
if(parentControl.elements[i].id.indexOf(strId) >= 0)
returnObject = parentControl.elements[i];
else if(parentControl.elements[i].hasChildNodes())
returnObject = FindControl(parentControl.elements[i],strId);
if(returnObject != null)
{ //if object is found return
return returnObject;
}
}
return returnObject;
}
</script>
but none of it seems to work, does anyone has an idea what's going on with the label with id tb_TA_2_6.
The form view looks like
<asp:FormView ID="FormView1" runat="server" ClientIDMode="Static">
<ItemTemplate>
<asp:Label ID="labelID" runat="server" Text='<%#Bind("ID") %>' Visible="false"></asp:Label>
<table id="table1">
<tr>
<td>
<span > Textbox1 </span>
</td>
<td>
<asp:TextBox ID="tb_TA_2_4" onBlur="Javascript:autosum(this, '<%= tb_TA_2_6.ClientID%>');" runat="server" Text='<%#Bind("question6i","{0:$#,#0.00}") %>'></asp:TextBox>
</td>
</tr>
<tr>
<td>
<span>6. (iii) Total Value </span>
</td>
<td>
<asp:Label ID="tb_TA_2_6" runat="server" ReadOnly="true" Text='<%#Bind("question6iii", "{0:$#,#0.00}") %>' OnPreRender="FormView1_PreRender" ></asp:Label>
</td>
</tr>
</table>
</ItemTemplate>
html rendered is like following, I removed the style information in my question.
<tr>
<td style="vertical-align: middle; width: 697px; height: 15px; border-style: solid;
border-color: #6699cc; border-width: 1px; border-top: 1px solid #fff;">
<span style="font-family: MS Sans Serif; font-size: 14px; color: #000000">6. (iii) Total
Value of All Benefits For Payment of Utilities </span>
</td>
<td class="alignright" style="vertical-align: top; width: 157px; height: 15px; border-style: solid;
border-color: #6699cc; border-width: 1px; border-left: 1px solid #fff; border-top: 1px solid #fff;">
<span id="ctl00_cph_Main_FormView1_tb_TA_2_6" ReadOnly="true" style="font-size:12pt;">$60.00</span>
</td>
</tr>
Share
Improve this question
edited Jan 11, 2012 at 16:26
codemaster
asked Jan 11, 2012 at 16:00
codemastercodemaster
5721 gold badge6 silver badges16 bronze badges
6
- please add your HTML source as well. It shows the genereated IDs. – Stefan Commented Jan 11, 2012 at 16:18
-
Try removing the single quotes and appending
;
onvar c = <%= 'tb_TA_2_6'.ClientID%>
.var c = <%= tb_TA_2_6.ClientID %>;
– Stefan Commented Jan 11, 2012 at 16:22 - ; is added in the end of each statement, it's just a copy paste mistake that i didn't add ; in the post. – codemaster Commented Jan 11, 2012 at 16:25
- Great, posted my answer. – Stefan Commented Jan 11, 2012 at 16:56
- @Stefan - I have added a ment to your answer. I know that I can get label using ctl00_cph_Main_FormView1_tb_TA_2_6. but how to get this id. using client mode as static renders all textboxes with the id that I specify, but labels take id like this. – codemaster Commented Jan 11, 2012 at 17:12
2 Answers
Reset to default 3Label
controls render as a span
in the HTML.
To access it you need to get it's ClientID
.
You can change your javascript to:
var a = document.getElementById('<%= tb_TA_2_6.ClientID %>');
Your var c
example had the Label
control name wrapped in quotes so that is why it was failing.
You could also set the ClientIDMode
to static
for you page if you want the controls to render their IDs exactly how you specify them. Then your original getElementById
will work as expected without having to get the rendered ClientID
.
See MSDN for ClientIDMode info.
EDIT: If your controls are part of a container template you need to access the control differently by getting the container control and then doing a FindControl
from it.
var a = document.getElementById('<%= FormView1.FindControl("tb_TA_2_6").ClientID %>');
As we can see your ASP.NET Label with ID "tb_TA_2_6" renders as a span
element with ID "ctl00_cph_Main_FormView1_tb_TA_2_6".
document.getElementById('ctl00_cph_Main_FormView1_tb_TA_2_6')
would then select the element.
You should also know that your label is created within a ItemTemplate
in your FormView
and that it most likely renders multiple items. This is why you can´t access tb_TA_2_6.ClientID
.
Now, which item do you want your Javascipt to select the span
element from?
UPDATE
It looks like you´re trying to create a table and summarize some value from each row. Here we go;
ASP.NET UserControl
<table id="myTable">
<asp:FormView ID="FormView1" runat="server">
<ItemTemplate>
<tr>
<td><span>Textbox1</span></td>
<td><asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("question6i", "{0:$#,#0.00}") %>' class="myValue" /></td>
</tr>
</ItemTemplate>
</asp:FormView>
<tr>
<td><span>6. (iii) Total Value</span></td>
<td><asp:Label ID="TextBox1SumLabel" runat="server" Text='<%# Bind("question6iii", "{0:$#,#0.00}") class="sum" %>' /></td>
</tr>
</table>
HTML, example of expected ouput
<table id="myTable" class="styledTable">
<tr>
<td><span>Textbox1</span></td>
<td><input type="text" id="SomeGeneratedClientID_00" class="myValue" Value='60.00' /></td>
</tr>
<tr>
<td><span>Textbox1</span></td>
<td><input type="text" id="SomeGeneratedClientID_01" class="myValue" Value='40.00' /></td>
</tr>
<tr>
<td><span>6. (iii) Total Value</span></td>
<td><span ID="ctl00_cph_Main_TextBox1SumLabel" class="sum">100.00</span></td>
</tr>
</table>
Javascript, jQuery
$(document).ready(function() {
// Bind the change event to all ".myValue" elements
$('#myTable .myValue').change(function() {
// Find parent table element
var $table = $(this).closest('table');
// Update summary
sumTableValues($table);
});
});
var sumTableValues = function($table) {
var sum = 0;
// Iterate through all .myValue elements
$table.find('.myValue').each(function(index) {
console.log(index, $(this).val()); // DEBUG
// NOTE: Need to make sure the value is a number
// Add the value to the sum
sum += Number($(this).val());
});
console.log('sum', sum); // DEBUG
// Update the sum
$table.find('tr:last .sum').text(sum);
//$('<%= TextBox1SumLabel.ClientID %>').text(sum);
};
Created a demo for you to play around with, really hope this helps you in any way.
本文标签: Get an aspnet Label control using javascriptStack Overflow
版权声明:本文标题:Get an asp.net Label control using javascript - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1744764609a2623963.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论