Right-to-left direction for Ext.NET TextField - right-to-left

I need to align the Ext:TextField control along with its FieldLabel attribute, as right-to-left direction.
By setting LabelAlign to right and body dir="rtl", I can only align all the control to the right.
And I get this format displayed:
---------Label:-|||||||TextField||||||||||
But how can I have the following format?
|||||||TextField||||||||||---------:Label

I'm not quite sure if this is possible as there is no real need for such options.
I would suggest that you leave the Label of the text field blank and that you insert an label to the end...
Example:
<ext:textfield ID="Text1" Text="I start on the left" runat="server" />
<ext:label ID="Label1" Text="I am a label starting on the left staying on the right" StyleSpec="float: left;" />
It should work like this!

FieldLabel will not work for rtl text fields. The only solution found is to enclose a Label and a Text Field inside table cells, aligned in a table row, with dir="rtl" set to the table or container, like the following.
<table dir="rtl">
<tr>
<td>
<ext:Label ID="Label1" Text="Sample Label" runat="server" />
</td>
<td>
<ext:textfield ID="Text1" Text="Sample Text" runat="server" />
</td>
</tr>
</table>

Related

chromedp clear not working with select by query

I am having issues with chromedp.Clear()
I am succesfully able to fill the below input with:
chromedp.SendKeys(`input[name="TESTFIELD"]`, "new value", chromedp.ByQuery)
But clearing it first with:
chromedp.Clear(`input[name="TESTFIELD"]`, chromedp.ByQuery)
A snippet of the HTML:
<input type="text" name="TESTFIELD" size="30" maxlength="30" value="" class="cssKenmerkNoLookup" valign="middle" onfocus=fnFieldChanged(this,1,0); onchange="fnSetDirty('cmdOK,cmdOKNext,cmdOKInvoeren,cmdStartMITOffice');" onkeydown="fnCheckForEdit('cmdOK,cmdOKNext,cmdOKInvoeren,cmdStartMITOffice', 'TESTFIELD',1);" onkeyup="fnCheckForEdit('cmdOK,cmdOKNext,cmdOKInvoeren,cmdStartMITOffice', 'TESTFIELD',0);" onpaste="fnCheckForEdit('cmdOK,cmdOKNext,cmdOKInvoeren,cmdStartMITOffice', 'TESTFIELD',0);" >
</td><td align="center" valign="middle" class="cssCellDetailsColLookup" nowrap >
I cant use the class, cssKenmerkNoLookup, since the same class is used with multiple inputs, so that is why I use "ByQuery"
What am I overlooking?
Issue solved.
by using:
chromedp.SetValue(selector, value, chromedp.ByQuery),
Current input value is replaced.

Xpath to match specific text

I have this HTML structure:
https://imgur.com/a/8TevWtz
<tbody>
<tr data-drupal-selector="edit-strings-996" class="odd">
<td><div id="edit-strings-996-original" class="js-form-item form-item js-form-type-item form-type-item js-form-item-strings-996-original form-item-strings-996-original form-no-label">
<label for="edit-strings-996-original" class="visually-hidden">Source string (Built-in English)</label>
Search
</div>
</span></td>
<td><div class="js-form-item form-item js-form-type-textarea form-type-textarea js-form-item-strings-996-translations-0 form-item-strings-996-translations-0 form-no-label">
<label for="edit-strings-996-translations-0" class="visually-hidden">Translated string (EspaƱol)</label>
<div class="form-textarea-wrapper">
<textarea lang="es" data-drupal-selector="edit-strings-996-translations-0" id="edit-strings-996-translations-0" name="strings[996][translations][0]" rows="1" cols="60" class="form-textarea resize-vertical">Search</textarea>
</div>
</div>
</td>
</tr>
<tr data-drupal-selector="edit-strings-1176" class="even">
<td><div id="edit-strings-1176-original" class="js-form-item form-item js-form-type-item form-type-item js-form-item-strings-1176-original form-item-strings-1176-original form-no-label">
<label for="edit-strings-1176-original" class="visually-hidden">Source string (Built-in English)</label>
Search page
</div>
I need a Xpath that I can find only the exact text "Search". I cannot use contains() because it will return all rows with this word, I need only the row with "Search" word only.
My knowledge of Xpath is not great, so I tried many things like:
//tbody/tr/td/div[.='Search']
//tbody/tr/td/div[normalize-space(.)='Search']
//tbody/tr[1]/td/div/. -> This one works but I cannot pass the tr[1] because I'll use this xpath in an automation and the text I want is not always in the first row, so I need to find by Text and not by Index.
The problem is that all texts have these whitespaces and it makes it worse for me to make it work.
Text content of target div node is not just "Search", but "Source string ... Search", so you can try
//div[normalize-space(text()[2])='Search']
Assuming you're looking for the div which has text containing the string Search, this should work:
//tbody/tr/td/div[contains(., 'Search')]
It's a bit dirty in that it would also detect Search anywhere under the div, e.g. including in the label's text, if applicable.

Range validator Error

when i set range of my text box i get error when i remove or comment it page runs kindly see my code and tell me error in it.
<asp:TextBox ID="TxtName" runat="server" ValidationGroup="Adduser" MaxLength="32"
Width="200px"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ValidationGroup="Adduser"
ErrorMessage="Provide user name" ControlToValidate="TxtName" Display="Dynamic">*</asp:RequiredFieldValidator>
<%--<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ValidationGroup="Adduser" ControlToValidate="TxtName" ErrorMessage="User ID Must be at least 8 Alpha Numeric Characters." ValidationExpression="^[a-zA-Z0-9]{8,}$">*</asp:RegularExpressionValidator>--%>
<asp:RangeValidator ID="RangeValidator2" runat="server" ErrorMessage="The ID Must Be 8 Characters." MaximumValue="32" MinimumValue="8" ControlToValidate="TxtName" Type="String"></asp:RangeValidator>
</td>
You shouldn't use RangeValidator for String type instead use RegularExpressionValidator
Try this,
<asp:TextBox ID="TxtName"
runat="server"
ValidationGroup="Adduser"
MaxLength="32"
Width="200px"></asp:TextBox>
<asp:RegularExpressionValidator
ID="RegularExpressionValidator2"
runat="server"
ValidationGroup="Adduser"
ControlToValidate="TxtName"
ErrorMessage="User ID Must be at least 8 Alpha Numeric Characters."
ValidationExpression="[a-zA-Z0-9]{8}">*</asp:RegularExpressionValidator>

only show two weeks Ajax Calender

I am using .Net3.5. I have a scenario where user selects the textbox the Ajax calender pops up. In that calender i just want to display only next two weeks. not entire month or year. How to do that?
<tr>
<td>
</td>
<td align="left">
Next Update Date
</td>
<td align="left">
<asp:TextBox ID="txtEditUpdateDt" runat="server"></asp:TextBox>
<cc2:CalendarExtender CssClass="AjaxCalendar" OnClientShowing="DisplayDateToday"
ID="CalendarExtender3" runat="server" PopupButtonID="txtEditUpdateDt" PopupPosition="BottomLeft"
TargetControlID="txtEditUpdateDt" Enabled="True" />
<asp:RegularExpressionValidator ID="valtxtEditUpdateDt" runat="server" Display="None"
ControlToValidate="txtEditUpdateDt" ErrorMessage="Please enter valid Date." ValidationExpression="((^(10|12|0?[13578])([/])(3[01]|[12][0-9]|0?[1-9])([/])((1[8-9]\d{2})|([2-9]\d{3}))$)|(^(11|0?[469])([/])(30|[12][0-9]|0?[1-9])([/])((1[8-9]\d{2})|([2-9]\d{3}))$)|(^(0?2)([/])(2[0-8]|1[0-9]|0?[1-9])([/])((1[8-9]\d{2})|([2-9]\d{3}))$)|(^(0?2)([/])(29)([/])([2468][048]00)$)|(^(0?2)([/])(29)([/])([3579][26]00)$)|(^(0?2)([/])(29)([/])([1][89][0][48])$)|(^(0?2)([/])(29)([/])([2-9][0-9][0][48])$)|(^(0?2)([/])(29)([/])([1][89][2468][048])$)|(^(0?2)([/])(29)([/])([2-9][0-9][2468][048])$)|(^(0?2)([/])(29)([/])([1][89][13579][26])$)|(^(0?2)([/])(29)([/])([2-9][0-9][13579][26])$))"></asp:RegularExpressionValidator>
<cc2:ValidatorCalloutExtender ID="ValidatorCalloutExtender3" runat="server" Enabled="True"
TargetControlID="valtxtEditUpdateDt">
</cc2:ValidatorCalloutExtender>
</td>
<td>
</td>
</tr>
Like #Dario said, I don't think you can't limit it in the simple ajax control. An alternative option would be to add a range validator.
<asp:RangeValidator ID="RangeValidatorDT"
runat="server"
ControlToValidate="txtEditUpdateDt"
ErrorMessage="* Invalid date range"
Type="Date">
</asp:RangeValidator>
Then on the page load
RangeValidatorDT.MinimumValue = System.DateTime.Now.ToShortDateString()
RangeValidatorDT.MaximumValue = System.DateTime.Now.AddDays(15).ToShortDateString()
According to what I know you can't do it, this calendar extender is very easy to use, but very limited, if you use the Calendar control you would be able to enable only the days that you want.

In RadGrid, how can we merge 2 datacolumns only for viewing, but still be able to edit them separately?

I have a Telerik's RadGrid which has 2 columns like this:
<Columns>
<telerik:GridBoundColumn HeaderText="AirlineCode" UniqueName="AirlineCode" DataField="airlineCode" />
<telerik:GridBoundColumn HeaderText="FlightNumber " EditFormColumnIndex="1" DataField="flightNumber" />
...
...
... more code, but unrelevant to the question here.
</Columns>
I am supplying the data for both columns in the relevant NeedDataSource() function.
So it renders correctly like this:
| AirlineCode | FlightNumber |
------------------------------------------
| Delta | 2393 |
| Southwest | 345 |
But now my requirement has changed a little bit.
For viewing, I want to merge them together and show it like this:
| Flight |
--------------------------
| Delta-2393 |
| Southwest-345 |
However, while editing the rows the user should be able to edit "AirlineCode" and "Flight Number" separately. And the values should still be correctly maintained in the datasource.
I know that if we want the user to "View" and "Edit" differently, we would have to use .
So I am trying something like this:
<Columns>
<telerik:GridTemplateColumn EditFormColumnIndex="0" HeaderText="Flight">
<ItemTemplate>
<%#DataBinder.Eval(Container.DataItem, "airlineCode")%>
<asp:Literal runat="server" Text="-"></asp:Literal>
<%#DataBinder.Eval(Container.DataItem, "flightNumber")%>
</ItemTemplate>
<EditItemTemplate>
<telerik:GridBoundColumn HeaderText="AirlineCode" UniqueName="AirlineCode" DataField="airlineCode" />
<telerik:GridBoundColumn HeaderText="FlightNumber " EditFormColumnIndex="1" DataField="flightNumber" />
</EditItemTemplate>
</telerik:GridTemplateColumn> ...
...
... more code, but unrelevant to the question here.
</Columns>
But its not working.
Those 2 lines inside are giving warnings:
Element 'GridBoundColumn' is not a known element. This can occur if there is a compilation error in the Web site, or the web.config file is missing.
Probably I am doing it wrong. Need help.
Any help is appreciated.
drpcken is correct. When you use the GridTemplateColumn, you do not need to use the GridBoundColumn. Instead, you supply the View and Edit template HTML and use the Bind expression to do two-way binding in the Edit template. For example:
<telerik:GridTemplateColumn UniqueName="TemplateColumn">
<ItemTemplate>
<%# Eval("airlinCode") %> - <%# Eval("flightNumber") %>
</ItemTemplate>
<EditItemTemplate>
<table>
<tr>
<td style="width: 50%">
<asp:TextBox runat="server" Text='<%# Bind("airlineCode") %>' />
</td>
<td style="width: 50%">
<asp:TextBox runat="server" Text='<%# Bind("flightNumber") %>' />
</td>
</tr>
</table>
</EditItemTemplate>
</telerik:GridTemplateColumn>
As you can see, you use Eval in the ItemTemplate and Bind in the EditItemTemplate. All other code should continue to work without change.
Let me also highlight the Telerik Forums. For Telerik specific questions, there is an active community available to help troubleshoot: www.telerik.com/forums
It has been a while since I used the radgrid, but in your edit template I believe you need to remove the GridBoundColumns and put two textbox controls separated by the dash. Then use your Databinder to fill those txt boxes. Sorry I can't be more concise as I'm typing on my iPhone and can't test. I will followup with you when I am in front of my machine.
Good luck!

Resources