Extending jquery to select ASP.NET controls

Costas

Administrator
Staff member

ASP.NET 4
http://weblog.west-wind.com/posts/2009/Nov/07/ClientIDMode-in-ASPNET-40
http://weblog.west-wind.com/posts/2010/May/04/Whats-New-in-ASPNET-40-Part-Two-WebForms-and-Visual-Studio-Enhancements


ref - http://www.codeproject.com/Articles/34151/ASP-NET-Client-ID-Feature
add html attribute
JavaScript:
clientidmode="Static"

to retain the id!


JavaScript:
Add ClientIDMode="Static" to each Page  (or in web.config’s 
 setting)
 
 
when asp control
JavaScript:
<script>
 $('#<%= buttonAdd.ClientID %>')
</script>

<asp:Button ID="buttonAdd" runat="server" Text="Add" />


 

 

2009
 
http://www.foliotek.com/devblog/extending-jquery-to-select-asp-controls/


If you have worked with JavaScript in an ASP.NET Web Forms environment, you almost certainly have been frustrated that this markup:

JavaScript:
	<asp:textbox runat="server" id="txtPhoneNumber"></asp:textbox>

renders out as something like:

JavaScript:
	<input type="text" id="ctl00_ctl00_ctl00_main_Content_txtPhoneNumber" name="ctl00$ctl00$ctl00$main$Content$txtPhoneNumber">
 
 
 
github - https://gist.github.com/bgrins/4148366
 
JavaScript:
// Include this function before you use any selectors that rely on it
	if ($.expr.createPseudo) {
	  jQuery.expr[':'].asp = $.expr.createPseudo(function( id ) {
		  return function(elem) {
			  return elem.id && elem.id.match(id + "$")
		  };
	  });
	}
	else {
		jQuery.expr[':'].asp = function(elem, i, match) {
			return !!(elem.id && elem.id.match(match[3] + "$"));
		};
	}

	// Now all of these are valid selectors
	// They show why this method has more functionality than the previous $asp() function.
	$(":asp(txtPhoneNumber)")
	$("input:asp(txtPhoneNumber):visible")
	$(":asp(txtPhoneNumber), :asp(txtAddress)")
	$("ul:asp(listTodos) li")
	$("#content").find("ul:asp(listTodos)")
 
Top