Asp.NET not getting updated values of custom attributes set by javascript
Question
This problem has been bugging me and any explanation of why this is would help.
Given the following DOM:
<body>
<form id="form1" runat="server">
<div id="myDiv" runat="server" data-type="Monkey">
Choose your inner animal!
<ul>
<li class="selected">Monkey</li>
<li>Tiger</li>
<li>Dog</li>
<li>Bunny</li>
</ul>
</div>
<asp:Button runat="server" ID="btnSubmit" Text="Submit" />
</form>
</body>
<script src="Assets/js/jquery-1.9.0.min.js" type="text/javascript"></script>
<script>
$(document).ready(function () {
$('li').bind('click', function () {
$('li.selected').removeClass('selected');
var animal = $(this).addClass('selected').text();
//$('#myDiv').data('type', animal);
$('#myDiv').attr('data-type', animal);
});
});
</script>
Code Behind:
Partial Class _Default
Inherits System.Web.UI.Page
Protected Sub btnSubmit_Click(sender As Object, e As System.EventArgs) Handles btnSubmit.Click
Dim type As String = myDiv.Attributes("data-type")
MsgBox(type)
End Sub
End Class
The MsgBox always comes back with the default value of 'Monkey'. Now i did implement a workaround where I stored the value in a Hidden field, then recalled the value on button click and that works. I did try an update panel but no luck, but that doesn't really matter because I hate update panels and never use them anyways.
3 answers
solution1
2 ACCPTED 2013-02-26 18:30:03
This is a limit - if you want to call it that - of HTML and the way things post back. It's not even an ASP.NET limit, as far as I am aware: it goes beyond that.
Only certain tags have their values posted back to the server. I'm thinking it's just INPUT and SELECT tags, although there may be one I'm not thinking of.
Attributes in tags don't even get posted back: just values.
So the server doesn't know anything about what you've changed on the client, unless it's what's selected in a SELECT or the value of an INPUT. Everything in ASP.NET, everything that gets reconstructed from ViewState and postback data, is based on those tags.
So your hidden field is the only way what you want can happen.
solution2
0 2013-04-09 17:04:53
In case of SELECT, if the "disabled" attribute is set to true in JQuery then in ASP .Net code-behind, you will not get the correct values but instead, you will get the first item in the list as selecteditem and it's corresponding value as selectedvalue. Same is the case for INPUT as well.
I think the simplest option is to use the hidden fields, populating them in JQuery and using their values in code-behind.
solution3
0 2013-12-04 07:59:18
Another common reason is if you rebuild the dropdown list in code behind on the page_load function without checking that it's not IsPostBack first. This would cause you to reset the value each time to the default/first item.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.