I have implemented l20n localization.
l20n file:
<form {
title: "Some text"
}>
in html i want to get SOme Text using
<p data-l10n-id="form.title"></p>
But i've got just form.title instead real value. also I am getting right strings instead one level vars.
My understanding of l20n is that you can't do it that way. You have to define an entity for your p. If you want to reuse another entity to avoid duplication*, you can do it that way:
<title "some text>
<form title:"{{title}}">
<p "{{title}}">
And your html like this:
<form data-l10n-id='form'>
<p data-l10n-id='p'></p>
</form>
Duplication is actually okay in localization context, as explained in this anwser.
Related
I am learning the MEAN stack. I'm performing CRUD operations. I'm stuck with update. Not with the operation exactly. Actually before updating a previously posted article I want to load contents in text fields for final changes. Those text fields are title and content. Where title is a simple text field and content is quill text editor value.
Here is my articles.component.html
Title:<br>
<input type="text" id="title-container" name="title" >
<br>
Content:<br>
<input type="text" id="content-container" name="content">
<br><br>
<input type="submit" value="Submit">
and here's my article.component.ts
This method is called from somewhere else when I click edit button.
onPress2(id) {
this._articleService.fetchArticle(id)
.subscribe (
data => {
document.querySelector('#title-container').innerHTML=data.title;
document.querySelector('#content-container').innerHTML=data.content;
}
);
}
Everything works perfectly if I replace innerHTML with value. But I cannot do so because my content field has value something like <h1>How to make Cheese cake</h1><br>... because I am using quill text editor. Please tell me what wrong with this code.
I think all you looking for is
document.querySelector('#title-container').value=data.title;
document.querySelector('#content-container').value=data.content;
I did some more research on html elements. Here are my observations and solution.
You cannot use innerHTML on input tag because it is a self closing tag and innerHTML as the name suggests works with tags which have both opening and closing tags For eg. div, 'span', etc. So, innerHTML and value are two different things.
Solution
Instead of an input tag, you can use div and add an attribute contentEditable="true" which will make it editable like input field:
<div contentEditable="true" id="content-container" value="">
</div>
This will solve the problem. And in ts file. You are good to use:
...
document.querySelector('#content-container').innerHTML=data.content;
...
For the following html code:
<div class="r signbox">
<form method="POST" id="loginByEmail">
<dl>
<dt>Seller Login</dt>
<dd>
<input type="text" class="text" name="email" placeholder="Email Address" value="">
<div class="error"></div>
How could I select the "email" attribute in name? The reason why is because the site uses two form boxes that have the same name so I want to target specifically the one in the class "r signbox". Thanks for your help, completely new to Selenium Webdriver.
First select all the content of the class "r signbox" in your selector.
After you pick the desired information, you can take the derised information using a new selector in sequense in the same code block. As you asked, using attr name will be:
$(".r.signbox [class='email']");
By same name you mean the id attribute?
If so, that's odd.
If not, I suggest you to map first the form element and after the input. Doing so, you will be preventing your test to break in case another form to be added between the div.r.signbox and the form.#loginByEmail
Anyway, #Striter awnser is incorrect because he looking for anything with email as class.
A tip is to use the tags names to be more precise:
div.r.signbox input[name='email']
This looks for a div with both r and signbox and inside this element (see the space?) for an input with an attribute name valued as email.
Even if someone put a div with an attribute name valued as email between dd and dt, you locator will work fine.
Here is a good reference to CSS Selectors: https://saucelabs.com/selenium/css-selectors
If you like books, the first chapter of Selenium Testing Tools Cookbook will give you good knowledge: http://www.amazon.com/Selenium-Testing-Cookbook-Gundecha-Unmesh/dp/1849515743
I´m really bad at programming, and I´m trying to do a web aplication using html and jsp pages, the application have to allows the users to post things, and well that is the problem, because I can´t separate text and links from the textarea.
There is the method to post.
<div id ="post">
<form method="post" action="Validaciones.jsp" >
<textarea name="comentario" rows="4" cols="20" maxlength="140" id="coment" >
</textarea>
<button name="publicar" value="publicar">Publicar</button>
</form>
</div>
But so, when I do:
String texto = request.getParameter("comentario");
It return the parameter as a String, so if a put, "Hello visit my page: www.ducks.com", there is a way to know what is text and what is the link?
Because the aplication have to show the links as links, with the (a) tag.
Thanks for the help.
Dont use plain textarea.You need to use editors like CKEditor,TinyMce(to name a few).
These editors help to maintain the text formatting and save it into the database.So when you view this on another page you will be able to see whatever you had written earlier in the editor.Hence these editors are called WYSIWYG (What-You-See-Is-What-You-Get)
So use these editors in your page.
Use regular expressions
Pattern p = Pattern.compile("^(http|https|ftp)\://[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,3}(:[a-zA-Z0-9]*)?/?([a-zA-Z0-9\-\._\?\,\'/\\\+&%\$#\=~])*[^\.\,\)\(\s]$", Pattern.CASE_INSENSITIVE);
String toMatch = "this is a URL http://google.com";
Matcher m = p.matcher(toMatch);
With the url , use substring for the string.
Newbie to ASP.net MVC 4 and trying to make sense of Razor. If I wanted to just display some text in my .cshtml page, can I use
<label class="LabelCSSTop">Introduction</label>
or should I use:
#Html.Label("STW", htmlAttributes: new { #class = "LabelCSSTop" })
Not sure if one is preferred over the other or if either is okay. If the latter emits the label tag anyway, should I just stick to the former?
Again, if I just wanted to display a text box, can I just do this:
<input id="txtName" type="text" />
or should I do this:
#Html.TextBox("txtName", "")
Is there a situation when I should use the #Html over the regular html tag?
Thanks in advance!!
In the case of your label snippet, it doesn't really matter. I would go for the simpler syntax (plain HTML).
Most helper methods also don't allow you to surround another element. This can be a consideration when choosing to use/not use one.
Strongly-Typed Equivalents
However, it's worth noting that what you use the #Html.[Element]For<T>() methods that you gain important features. Note the "For" at the end of the method name.
Example:
#Html.TextBoxFor( o => o.FirstName )
This will handle ID/Name creation based on object hierarchy (which is critical for model binding). It will also add unobtrusive validation attributes. These methods take an Expression as an argument which refers to a property within the model. The metadata of this property is obtained by the MVC framework, and as such it "knows" more about the property than its string-argument counterpart.
It also allows you to deal with UI code in a strongly-typed fashion. Visual Studio will highlight syntax errors, whereas it cannot do so with a string. Views can also be optionally compiled along with the solution, allowing for additional compile-time checks.
Other Considerations
Occasionally a HTML helper method will also perform additional tasks which are useful, such as Html.Checkbox and Html.CheckboxFor which also create a hidden field to go along with the checkbox. Another example are the URL-related methods (such as for a hyperlink) which are route-aware.
<!-- bad -->
my link
<!-- good -->
#Html.ActionLink( "my link", "foo", "bar", new{ id=123 } )
<!-- also fine (perhaps you want to wrap something with the anchor) -->
<span>my link</span>
There is a slight performance benefit to using plain HTML versus code which must be executed whenever the view is rendered, although this should not be the deciding factor.
Depends on what your are doing.
If you have SPA (Single-Page Application) the you can use:
<input id="txtName" type="text" />
Otherwise using Html helpers is recommended, to get your controls bound with your model.
If you want to just display some text in your .cshtml page, I do not recommend #Html.Label and also not to use the html label as well. The element represents a caption in a user interface. and you'll see that in the case of #Html.Label, a for attribute is added, referring to the id of a, possibly non-existent, element. The value of this attribute is the value of the model field, in which non-alphanumerics are replaced by underscores.
You should use #Html.Display or #Html.DisplayFor, possibly wrapped in some plain html elements line span or p.
The helpers are there mainly to help you display labels, form inputs, etc for the strongly typed properties of your model. By using the helpers and Visual Studio Intellisense, you can greatly reduce the number of typos that you could make when generating a web page.
With that said, you can continue to create your elements manually for both properties of your view model or items that you want to display that are not part of your view model.
When it comes to labels, I would say it's up to you what you prefer. Some examples when it can be useful with HTML helper tags are, for instance
When dealing with hyperlinks, since the HTML helper simplifies routing
When you bind to your model, using #Html.LabelFor, #Html.TextBoxFor, etc
When you use the #Html.EditorFor, as you can assign specific behavior och looks in a editor view
#html.label and #html.textbox are use when you want bind it to your model in a easy way...which cannot be achieve by input etc. in one line
I'm using django-uni-form to style my form using the filter my_form|as_uni_form:
<form class="uniForm" id="my_form" method="post" action="./">
<fieldset class="inlineLabels">
{{ my_form|as_uni_form }}
<div class="form_block">
<input type="submit" value="Submit"/>
</div>
</fieldset>
</form>
It looks really good. But I need to customize it.
For example, one of the field "percentage" of the form is of the type IntegerField. It is being rendered as an <input type="text">. The problem is that the text box is really wide, I'd like to make it only 2 character wide. Also I want to add a percentage sign "%" right after the text box so that users know they if they put in the number "10" in the text box, it means 10%.
Is there anyway to do that with django-uni-form?
Thanks for your help.
You'll need to loop over the elements of your form and render the uniForm markup yourself. Either that, you can customize the look of each input based on an id or class.
What I'd do is look at the mark up it generates, and then loop over the elements generating that same markup and customize them. See the Django docs for more information.
I have the same question as yours. I think the length of the text input is easy to change via css. I'm more concerned about the custom html element behind the input, in your case percentage mark. I don't find an easy solution to it. Looks like either we have to mimick the way a field is rendered in django-uni-form template or write a filter of our own. I'm still waiting for a more elegant solution.