ASP.NET Provide Styling for TextBox - asp.net

I am using a multiline textbox as following:
<asp:TextBox runat="server" TextMode="MultiLine" Height="200" Width="500" ReadOnly="true" Font-Names="calibri" Text="Terms and Conditions Next text will go over.. >
What I need to do is to only make Terms and Conditions in bold. Rest of the sentence is not in bold. I tried using a span with a style of bold but that did not affect anything.
How do I do styling for a Textbox? Keep in mind this is a read only textbox.

If i understand you right, u need this
http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/HTMLEditorExtender/HTMLEditorExtender.aspx
<script>
function onContentsChange() {
alert('contents changed');
}
</script>
<asp:TextBox runat="server"
ID="txtBox1"
TextMode="MultiLine"
Columns="50"
Rows="10"
Text="Hello <b>world!</b>" />
<ajaxToolkit:HtmlEditorExtender
ID="htmlEditorExtender1"
TargetControlID="txtBox1"
OnClientChange="onContentsChange"
runat="server" >
</ajaxToolkit:HtmlEditorExtender>

what you need is more than a regular textbox, you should either use devexpress or ajax toolikt, or some other ajax libraries.
you might consider looking for library that gives you rich formatting abilities

Related

How to add (hidden) label for asp:CheckBox?

I ran chrome's lighthouse accessibility test on a page I'm working on and it says
Form elements do not have associated labels
for all the checkboxes used on the page. They are in a large grid and have no labels.
Ex:
<asp:CheckBox ID="cbNotApplicable" runat="server" AutoPostBack="true" OnCheckedChanged="cbNotApplicable_CheckedChanged" onClick='javascript:needToConfirm = false;' ToolTip="Answer all questions Not Applicable" />
If I add a Text attribute, the accessibility warning goes away, but a <label> is added and visible, which I do not want.
Is there an alternate way to make the asp:CheckBox accessible?
Try this way
<asp:Label ID="test" runat="server"
AssociatedControlID="cbNotApplicable"> <asp:CheckBox ID="cbNotApplicable" runat="server" AutoPostBack="true" OnCheckedChanged="cbNotApplicable_CheckedChanged"
onClick='javascript:needToConfirm = false;' ToolTip="Answer all questions Not Applicable" /> </asp:Label>
Or, try this below link suggestions to hide label by using CSS
https://stackoverflow.com/a/13482643/2218635

PNM Sequence & asp.net: GridTemplateColumn should be mandatory

I use PNM Sequence. And I need to make one grid column as the mandatory field.
I know how to make it with any separate control. E.g. I can type:
<sq8:GridBoundColumn DataField="txtField" HeaderText="txtField"
SortExpression="txtField" UniqueName="txtField" FilterControlAltText="">
<ColumnValidationSettings>
<RequiredFieldValidator ForeColor=""></RequiredFieldValidator>
</ColumnValidationSettings>
</sq8:GridBoundColumn>
And I can use this Validator for the TextBox:
<sq8:Label runat="server" Text="Field:" ID="Label1" Width="100%"></sq8:Label>
<nobr>
<sq8:TextBox runat="server" ID="txtField" Width="100%"></sq8:TextBox>
<sq8:RequiredFieldValidator runat="server"
ErrorMessage="RequiredFieldValidator"
ID="RequiredFieldValidator4"
ControlToValidate="txtField"
SetFocusOnError="True">*</sq8:RequiredFieldValidator>
</nobr>
<sq:BindableControl runat="server" TargetControlID="txtField"
DataField="txtField"></sq:BindableControl>
And it works. User can't send the form because he gets an error - the field is empty.
But I need to do the same with grid.
When I open "Edit columns" in Grid Wizard I can't see any property as "mandatory" or something like this.
And the code with RequiredFieldValidator doesn't work with a grid column. If I try to use it:
<Columns>
<sq8:GridBoundColumn DataField="txtFieldGrid" HeaderText="txtFieldGrid"
SortExpression="txtFieldGrid" UniqueName="txtFieldGrid"
FilterControlAltText="">
<sq8:RequiredFieldValidator runat="server"
ErrorMessage="RequiredFieldValidator"
ID="RequiredFieldValidator4"
ControlToValidate="txtFieldGrid"
SetFocusOnError="True">*</sq8:RequiredFieldValidator>
<sq:BindableControl runat="server" TargetControlID="txtFieldGrid"
DataField="txtFieldGrid"></sq:BindableControl>
</sq8:GridBoundColumn>
</Columns>
In this case, I have an error:
Is there some method for grid column validation? Or it's impossible with a grid?
Maybe I can use some javascript?

Limit the amount of lines in a multi line asp.net textbox

On my asp.net web page I have a large multi line textbox where I want the user to be able to only fill in a maximum of 5 lines of text. (If the user were to press enter while on the 5th line it would simply not let him.)
The code I have for the textbox:
<asp:TextBox textmode="multiline"
runat="server"
ID="TextBox1"
name="TextBox1"
style="OVERFLOW:hidden; height:165px; width:95%; resize:none;">
</asp:TextBox>
I have tried it with the Rows property and several JavaScript functions, with no success.
Is this possible with an asp.net textbox or is there any other type of textbox I could use in this case?
Thanks.
I don't think this is possible with the asp:TextBox without some extra work. FYI, the "Rows" and "Columns" properties are only a display metrics and won't restrict the number of characters or carriage returns. The MaxLength property is also well documented to be disabled when using "multiline" with an asp:Textbox.
However, you do have a few options shown below. Note: typically input is validated by length because you don't want it to exceed the field size in the database tables. Hopefully these examples will help.
1) Roll your own Javascript validator.
(this example is limited to validating length, not carriage returns, but you could customize further.)
<asp:TextBox textmode="multiline"
runat="server"
ID="TextBox1"
name="TextBox1"
onkeypress="return EnforceFieldLengthMax(this,10)"
style="OVERFLOW:hidden; height:165px; width:95%; resize:none;">
</asp:TextBox>
<script language="javascript">
function EnforceFieldLengthMax(txt, maxLen)
{
if (txt.value.length > (maxLen - 1))
{
return false;
}
}
</script>
2) Regular Expression validator
(Unfortunately, this won't fire until the control loses focus, so I don't think this one is what you're looking for, but here is an example just in case)**
<asp:TextBox textmode="multiline"
runat="server"
ID="TextBox2"
name="TextBox2"
style="OVERFLOW:hidden; height:165px; width:95%; resize:none;">
</asp:TextBox>
<asp:Label AssociatedControlID="txtValidateMe"></asp:Label>
<asp:RegularExpressionValidator ID="TextBox2Validator"
ControlToValidate="TextBox2" ErrorMessage="Entry can't exceed 20 characters"
ValidationExpression="^[\s\S]{0,20}$" runat="server" Display="Dynamic" SetFocusOnError="true" />
3) Use the HTML TextArea object which does enforce MaxLength
<textarea maxlength="50"></textarea>

Getting text out of textarea from a ASP.NET GridView update

i'm loosing my mind. Using ASP.NET in a GridView, amongst other controls, I have the following:
<asp:TemplateField HeaderText="Intention">
<EditItemTemplate>
<asp:TextBox ID="IntentionInfo" Enabled="true" TextMode="MultiLine" Wrap="true" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:TextBox ID="IntentionInfo" Enabled="false" TextMode="MultiLine" runat="server" />
</ItemTemplate>
</asp:TemplateField>
I would like to take the value out of this textarea and save in a database. However, server side, I try to pull the value out, like such:
string txt = (TextBox)DonationResultsTable.Rows[e.RowIndex].Cells[6].Controls[1].Text;
... but I keep getting the value that was SENT to the Client.
I wrote this javascript and I can see the values change in the DOM, but still the server keeps taking the old value.
$("textarea").change(function()
{
var txt = $(this).val();
$(this).html(txt).text(txt);
});
So my guess was ViewState, but I disabled it for those controls, like this:
<asp:TextBox ID="IntentionInfo" ViewStateMode="Disabled" Enabled="false" TextMode="MultiLine" runat="server" />
Still nothing! Any ideas?
One option could be to use a hidden field and update it on text changed for the text area. You could do this with jQuery like this:
$("textarea[id$=tbTest]").change(function () {
$("input[id$=hdnVal]").val($("textarea[id$=tbTest]").val());
});
Then on the server side, you can retrieve the hidden field's value and save it to your database.

ASP.NET How to pass container value as javascript argument

I am using an oBout Grid control with a template on a textbox.
I would like to pass an argument to a javascript, the current row index of a grid when a user clicks on it.
But the result of
onClick='setGridInEditMode(<%# Container.RecordIndex %>);' />
comes out as
onClick="setGridInEditMode(<%# Container.RecordIndex %>);"
Is there a way to pass container value to javascript?
Here is the markup in question.
<cc1:Grid ID="_TrustGrid" runat="server"
FolderStyle="Styles/style_7"
AllowAddingRecords="False"
AllowSorting="false"
AllowPageSizeSelection="False"
AllowPaging="False"
AllowMultiRecordEditing="true"
AutoGenerateColumns="False"
OnUpdatecommand="_TrustGrid_UpdateCommand"
OnRebind="_TrustGrid_Rebind">
<Columns>
<cc1:Column AllowEdit="true" AllowDelete="false" HeaderText="Edit" Width="130" runat="server" />
<cc1:Column DataField="TrustDocID" HeaderText="TrustDocID" Width="125" ReadOnly="false" AllowDelete="false" TemplateId="trustDocIDGridTemplate" />
</Columns>
<Templates>
<cc1:GridTemplate ID="trustDocIDGridTemplate" ControlID="tb1" runat="server">
<Template>
<asp:TextBox ID="trustDocIDTextBox" runat="server"
Visible="true"
Text='<%# Container.Value %>'
onClick= 'setGridInEditMode(<%# Container.RecordIndex %>);' />
</Template>
</cc1:GridTemplate>
</Templates>
</cc1:Grid>
I'd second Darin's call for using unobtrusive JavaScript. However, that doesn't answer your question on why ASP.NET is doing this.
The reason you get
onClick="setGridInEditMode(<%# Container.RecordIndex %>);"
is because databinding to server control properties requires you to bind directly to the property without intervening text. That means, only Property="<%# ... %>" is allowed.
So in your case, you'll need to say what you want in a roundabout fashion (although I personally think this is a little clearer and more maintainable):
onClick='<%# String.Format("setGridInEditMode({0});", Container.RecordIndex) %>'
(Watch your single and double quotes though!)
This limitation applies only to server controls and their properties. It does not apply to a server control's nested literal content (such as bodies of templates or panels) nor to plain HTML used elsewhere, which is probably why you've never noticed this before.
Instead of polluting your HTML with javascript functions how about an unobtrusive solution using jQuery:
$(function() {
$('#_TrustGrid input[id*=trustDocIDTextBox]').each(function(index) {
$(this).click(function() {
setGridInEditMode(index);
});
});
});
If you prefer instead the more ASP.NETish solution you could always do this:
<asp:TextBox
ID="trustDocIDTextBox"
runat="server"
Visible="true"
Text='<%# Container.Value %>'
onclick='<%# "setGridInEditMode(" + Container.RecordIndex + ")" %>' />

Resources