← Tutti gli articoli
Access Values from All or Selective TextBoxes using jQuery
30 March 2011 ·
jQuery · Article ·
7 visite
You want to access values from ALL or Selective ASP.NET Textboxes on a Button click. The values should be displayed separately on each line. Empty Textboxes should be ignored.
Solution:
<%@ Page Language="C#" AutoEventWireup="true" EnableTheming="false" Theme="" CodeFile="R1-AccessAllTextBoxes.aspx.cs" Inherits="ASPNET_TextBox_AccessAllTextBoxes" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Access Values From Multiple or Selected ASP.NET TextBoxes</title>
<link href="../CSS/Demos.css" rel="stylesheet" type="text/css" />
<script type='text/javascript'
src='../Scripts/jquery-1.3.2.min.js'>
</script>
<script type="text/javascript">
$(function() {
$('input[id$=btnAll]').click(function(e) {
e.preventDefault();
$("#para").text('')
.append($("input:text").map(function() {
return $(this).val() || null;
}).get().join("<br/> "));
});
$('input[id$=btnSel]').click(function(e) {
e.preventDefault();
$("#para").text('')
.append($("input.selected").map(function() {
return $(this).val() || null;
}).get().join("<br/> "));
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div class="bigDiv">
<h2>Access Values From Multiple/Selected ASP.NET TextBoxes</h2><br />
<asp:TextBox ID="tb1" runat="server" Text="1stTextBox" /><br />
<asp:TextBox ID="tb2" runat="server" Text="2ndTextBox"/><br />
<asp:TextBox ID="tb3" runat="server" Text="3rdTextBox"/><br />
<asp:TextBox ID="tb4" runat="server" Text="1stTextBox-class-selected" class="selected" /><br />
<asp:TextBox ID="tb5" runat="server" Text="4thTextBox"/><br />
<asp:TextBox ID="tb6" runat="server" Text="2ndTextBox-class-selected" class="selected" /><br /><br />
<asp:Button ID="btnAll" runat="server" Text="Display All" ToolTip="Click to display text from all boxes" /><br />
<asp:Button ID="btnSel" runat="server" Text="Display Selective" ToolTip="Click to display text from boxes with class-selected" />
<br/>
Tip: Clicking on the 'Display Selective' button retrieves<br />
values from only those TextBoxes which have 'class=selected'
<p id="para"></p>
</div>
</form>
</body>
</html>