Azure Devops Process Template XML custom Control tag

276 Views Asked by At

I am designing html button inside WebpageControl tag for tfs workitems, which is inside control tag. When it renders in Azure Devops page the default size of the box is bigger than that of the button control, unable to resize the control box. Is there any way to make border disappear or resize to fit the button control?

<Group Label="">             
               <Control Type="WebpageControl">
                 <WebpageControlOptions>
                  <Content> 
                     <![CDATA[<button><a target="_blank" onclick="window.open('/sample-form.html','name','width=313,height=371')"><b>Click Here To register</b></a></button>]]>
                   </Content> 
                </WebpageControlOptions> 
              </Control>              
</Group>

enter image description here

When I inspect element saw below div tag is rendered.

<div class="webpagecontrol" style="height: 201.979px;">
<iframe frameborder="0"></iframe>
</div>

This is happening only in case of <Control Type="WebpageControl"> tag other tags rendering without any borders/box.

1

There are 1 best solutions below

2
Hugh Lin On

Update:

We can try to set div's height. This can control the size of the border.

For example:

<div class="webpagecontrol" style="height: 100%;">
    <iframe id="frame" style="width:100%" frameborder="0"></iframe>
</div>

Here is a case with similar issue you can refer to.

For previous server version, we can use the Control element MinimumSize attribute to specify the minimum width and height that each form element should occupy. If you do not have sufficient vertical space, a scrollbar appears to keep its minimum size. Without this attribute, the controls are drawn by using their default sizes, unless controls in other tabs take more space that increases the size of the tab. You can use other attributes, such as Margin and Padding, to align or stretch the control and define the size of the border around the control.

MinimumSize: Specifies the minimum size, in pixels, that the control should occupy in the form. Two values are specified that correspond to the width and height. For example: (100,100).

For more information, please refer to Control the size of form elements.