Reputation: 2048
I have a nested ListView (Master/Detail) questionaire that was described in this posting: The inner list item must call a server method with three arguments. Thanks to several of you, I have code that properly generates the JavaScript; however, that code is not actually firing. Here is the declaration of the inner list view:
<asp:ListView ID="lstAnswers" runat="server" DataKeyNames="QuestionID" OnItemDataBound="lstAnswers_ItemDataBound">
<LayoutTemplate>
<tr id="ItemPlaceholder" runat="server" />
</LayoutTemplate>
<ItemTemplate>
<tr>
<td style="vertical-align: top; font-weight: bold;">
<asp:Label ID="lblPAQID" runat="server" Text='<%#Eval("ThisPAQID") %>' Visible="false" />
<asp:Label ID="lblPAQVersion" runat="server" Text='<%#Eval("PAQVersion") %>' Visible="false" />
<asp:Label ID="lblQuestionID" runat="server" Text='<%#Eval("QuestionID")%>' />
</td>
<td style="vertical-align: top;">
<asp:Label ID="lblQuestionText" runat="server" Text='<%#Eval("Question")%>' />
</td>
<td style="vertical-align: top;">
<asp:TextBox ID="txtAnswer" runat="server" Class="PAQAnswer" Text='<%#Eval("Answer")%>' />
<script type="text/javascript"> **THIS SCRIPT IS NOT FIRING**
var textBox = document.getElementById("txtAnswer");
if (document.attachEvent) {
document.attachEvent("onblur", textBox, function() {
SaveAnswer('<%#Eval("ThisPAQID")%>', '<%#Eval("QuestionID")%>', window.event.target.value);
});
} else {
document.addEventListener("blur", textBox, function() {
SaveAnswer('<%#Eval("ThisPAQID")%>', '<%#Eval("QuestionID")%>', this.value);
}, false);
}
</script>
</td>
</tr>
</ItemTemplate>
</asp:ListView>
The generated code looks like this:
<input name="lstQuestions$ctrl0$lstAnswers$ctrl0$txtAnswer" type="text" value="2.0" maxlength="3" id="lstQuestions_ctrl0_lstAnswers_ctrl0_txtAnswer" Class="PAQAnswer" style="width:30px;" />
<script type="text/javascript">
var textBox = document.getElementById("txtAnswer");
if (document.attachEvent) {
document.attachEvent("onblur", textBox, function() {
SaveAnswer('13242', '1', window.event.target.value);
});
} else {
document.addEventListener("blur", textBox, function() {
SaveAnswer('13242', '1', this.value);
}, false);
}
</script>
The embedded values in the SaveAnswer calls are correct; however, I don't know how to tie the input statement to the JavaScript. Probably amazingly simple, but I don't see it... yet.
Upvotes: 0
Views: 395
Reputation: 4721
this line looks like the problem:
var textBox = document.getElementById("txtAnswer");
txtAnswer
is not the actual ID of the control, so your script is not finding it. The ID of the input is lstQuestions_ctrl0_lstAnswers_ctrl0_txtAnswer
You should try something like:
var textBox = document.getElementById("<%= txtAnswer.ClientID %>");
which would translate to:
var textBox = document.getElementById("lstQuestions_ctrl0_lstAnswers_ctrl0_txtAnswer");
EDIT: Why not do this instead?
<asp:TextBox ID="txtAnswer" runat="server" Class="PAQAnswer" Text='<%#Eval("Answer")%>' onBlur="SaveAnswer('<%#Eval("ThisPAQID")%>', '<%#Eval("QuestionID")%>', this.value);" />
Upvotes: 2
Reputation: 19719
Try attaching the event like this:
var textBox = document.getElementById("txtAnswer");
if (textBox.attachEvent) {
textBox.attachEvent("onblur", function() {
SaveAnswer('13242', '1', window.event.target.value);
});
} else {
textBox.addEventListener("blur", function() {
SaveAnswer('13242', '1', this.value);
}, false);
}
PS: I Think Victor is right too, txtAnswer
isn't the actual ID of your node.
Upvotes: 0