Is there any way is XSL to align the following element to the right of the page after page generation and XSLT?
<RadioButton>
<Name>myRadio</Name>
</RadioButton>
Where RadioButton is a template defined as <input radio...etc>
once the page is generated you will need to do cosmetic alignments using cascading style sheets or something.
so in your xsl you might have template to make it like
<input type="radio" name="blah" class="moo" value="blah" />
and in .css have
.moo{
float:right;
}
or you can use an inline style like
<input type="radio" name="blah" style="float:left;" value="blah" />
Related
I want my radio buttons and label to be in same horizontal line. I'm using xmp tag to display raw html as options with radio button. But the text in xmp starts in new line. Is there any alternative to xmp tag.
`<input class="answer" type="radio" name="q3" value="0">
<label><xmp>The <head> section</xmp></label>
<br></br>
<input class="answer" type="radio" name="q3" value="1">
<label><xmp>Both <head> section and the body section are
correct</xmp></label>
<br></br>
<input class="answer" type="radio" name="q3" value="0">
<label><xmp>The <body> section</xmp></label>
<br></br>
<input class="answer" type="radio" name="q3" value="0">
<label>None of these</label>`
Here's how the gui looks like
Be aware:
The <xmp> element was used to surround HTML example text that should be rendered without interpreting any HTML elements between the opening and closing <xmp> tags. The element was deprecated in HTML 3.2 and is now obsolete. <xmp> was designed to render content exactly as typed, without compressing spaces.
Instead you should use < for the lesser than tag, and > for the grearter than tag, if you require the labels to contain non-functional HTML tags:
<input class="answer" type="radio" name="q3" value="0">
<label>The <head> section is here</label>
<br />
<input class="answer" type="radio" name="q3" value="1">
<label>2nd section goes here</label>
<br />
Which gives:
Please also note that the <br></br> can be shorthanded as: <br /> although these aren't really suitable for laying out elements on a page, although I think that's beyond the scope of this question.
A full list of available characters can be found here.
It's probably worth looking at Bootstrap's Form documentation.
Enabling Bootstrap is as simple as putting this in the head section of your document:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha256-azvvU9xKluwHFJ0Cpgtf0CYzK7zgtOznnzxV4924X1w=" crossorigin="anonymous" />
Then you can just play with the examples in the docs.
For example, here's a login form rendered nicely: https://jsfiddle.net/h4sdpqtg/
I have a HTML template coming from an XML file but the radio buttons don't have a span class in front of the label in order for me to customise this. Is there a way I can style this using angular JS. Here is an example of the code:
<input type="radio" id="" value="y" name="" checked="">
<label for="">Ja</label>
There is nothing we can do about the XML adding in a span class on the parse so it has to be done on our front end framework.
Can't you just use the element in the CSS? Why does it need to have a span in order to be styleable?
input["radio"]{/* some styles */}
label{/* some styles */}
I have this radio button in html
<input type="radio" name="group1" value="1"> Gray Scale<br>
</td>
</tr>
<tr><td align="left" valign="top" width="200">
<input type="radio" name="group1" value="2"> Old Style<br>
</td><td align="left" valign="top" width="200">
<input type="radio" name="group1" value="3"> Sharpening<br></td></tr>
but I using this Struts code will give me all over the place with no size and anything <s:radio name="option" list="#{'1':'Gray Scale', '2':'Old Style','3':'Sharpening'}" value="1" />
How can I have this radio button for struts 2s individually?
If you want to <s:radio> tag to render exactly as you want, you have to modify the Struts2 theme that you are using.
Here you have an example from a guy that solves a similar problem: Struts 2 How To Customize The Theme That Controls How A Struts 2 Tag Is Displayed In The Browser
Just to make it more clear what already have been described in good way by Pigueiras,Struts2 uses theme concept to render the HTML for the Struts2 based tags and internally it uses freemarker tempelates to generate HTML for you.
out of the box S2 comes with following three themes
xhtml
css_xhtml theme
simple
ajax (with deprecated DOJO tags)
By default S2 uses xhtml theme to render the HTML and under this theme it will generate certain tables to render the view.
it provides a way to customize the theme or you can define your own theme and can control the way HTML is being generated by the S2.
have a look at following doc for more details
struts-2-themes
themes-and-templates
creating_a_theme
Hello,
I am wondering if it is possible to change the wicket output html code. e.g. for the component "CheckBoxMultipleChoice" you will get the following html output.
<span wicket:id="letters">
<input name="letters" type="checkbox" value="0" id="letters_0"/><label for="letters_0">fff</label><br/>
<input name="letters" type="checkbox" value="1" id="letters_1"/><label for="letters_1">aaa</label><br/>
<input name="letters" type="checkbox" value="2" id="letters_2"/><label for="letters_2">bbb</label><br/>
<input name="letters" type="checkbox" value="3" id="letters_3"/><label for="letters_3">ccc</label><br/>
<input name="letters" type="checkbox" value="4" id="letters_4"/><label for="letters_4">ddd</label><br/>
</span>
if i dont want the <br/> tag, what can i do?
regards
It depends on the component.
For anything Panel-based, you can always subclass the component (MyPanel.java) and supply a different markup file (MyPanel.html). As long as you have the same wicket:ids in there, it works fine.
For built-in Wicket components that have markup elements embedded in their source code, like CheckBoxMultipleChoice, you're at the mercy of the custom API of the component. In your case it looks like you want CheckBoxMultipleChoice#setSuffix.
No, extract from the documentation
Components may alter their referring tag, replace the tag's body or insert markup after the tag. But components cannot remove tags from the markup stream. This is an important guarantee because graphic designers may be setting attributes on component tags that affect visual presentation.
however if you want add/remove new line spaces between your components you can change the display of component to block/inline
#Override
protected void onComponentTag(ComponentTag tag) {
super.onComponentTag(tag);
//block or inline
tag.put("style", "display:block");
}
or use a CSS class
Any idea why firefox acts so weird with this code?
It works perfect in IE & Chrome.
<LEGEND>Basistaal </LEGEND>
<LABEL class=alg_kantoor_taal for=alg_kantoor_taal>
<INPUT id=alg_kantoor_taal value=NL type=radio name=alg_kantoor_taal .>
NL
</LABEL>
<LABEL class=alg_kantoor_taal for=alg_kantoor_taal>
<INPUT id=alg_kantoor_taal value=FR type=radio name=alg_kantoor_taal .>FR</LABEL>
I have seen another question where firefox behaved strange because there was a block element inside the label. That is not the case here. I would have like to keep this structure since my css is based up this html... Guess i will have to change it to get it working in FF?
edit-> fiddle here :http://jsfiddle.net/ZXSKH/59/ you can see in firefox the radiobuttons just don't work as they should.
I'll save you the trouble and fix the HTML for you:
<LEGEND>Basistaal</LEGEND>
<INPUT id="alg_kantoor_taal-nl" value="NL" type="radio" name="alg_kantoor_taal" />
<LABEL class="alg_kantoor_taal" for="alg_kantoor_taal">NL</LABEL>
<INPUT id="alg_kantoor_taal-fr" value="FR" type="radio" name="alg_kantoor_taal" />
<LABEL class="alg_kantoor_taal" for="alg_kantoor_taal">FR</LABEL>
An element are built up with a opening and closing tag, or a single tag.
Double tag: <tagname>content</tagname>
Single tag: <tagname />
Also, an attribute should be surrounded with quotes: <tagname attribute="value" />
Please note that an element id should be unique at all times. You can't have 2 elements with the same id.
In fact, this should fix most of your problems. But please, for the love of god, learn how to use HTML properly first.
All elements on a page should have a unique id. Both of the lables reference the second input. You should give each input a unique id and change the for attribute of the label to reference the new id. Or you could remove the id and for attributes and it would work how you expect.
Move the input tags out of the labels.
<LEGEND>Basistaal</LEGEND>
<INPUT id="alg_kantoor_taal1" value="NL" type="radio" name="alg_kantoor_taal" />
<LABEL class="alg_kantoor_taal" for="alg_kantoor_taal1">NL</LABEL>
<INPUT id="alg_kantoor_taal2" value="FR" type="radio" name="alg_kantoor_taal" />
<LABEL class="alg_kantoor_taal" for="alg_kantoor_taal2">FR</LABEL>
http://jsfiddle.net/ZXSKH/61/