I have html stuff as below:
<div class="field-group">
<label for="customfield_10102">select list</label>
<select class="select" name="customfield_10102" id="customfield_10102">
<option value="-1">None</option>
</select>
</div>
<div class="field-group">
<label for="customfield_10103">select list1</label>
<select class="select" name="customfield_10103" id="customfield_10103">
<option value="-1">None</option>
</select>
</div>
any number of option as per configured. query:
change the position of <select class="select" name="customfield_10103" id="customfield_10103">
to append with <select class="select" name="customfield_10102" id="customfield_10102">
(with 40 px margin) and also have to change both select list's width.
After that, remove <div class="field-group"><label for="customfield_10103">select list1</label></div>
Any one can suggest me , how i could achieve this using JQUERY?
NOTE: just for reference, i need such customization in JIRA custom field which can be achievable using jquery.
Another related query:
Below is HTML stuff:
<li id="rowForcustomfield_10102" class="item">
<div class="wrap">
<strong title="select list" class="name">select list:</strong>
<div id="customfield_10102-val" class="value type-select editable-field inactive"
data-fieldtype="select" title="Click to edit">
final2 <span class="overlay-icon icon icon-edit-sml" />
</div>
</div>
</li>
<li id="rowForcustomfield_10103" class="item">
<div class="wrap">
<strong title="select list1" class="name">select list1:</strong>
<div id="customfield_10103-val" class="value type-select editable-field inactive"
data-fieldtype="select" title="Click to edit">
1 <span class="overlay-icon icon icon-edit-sml" />
</div>
</div>
</li>
I want to remove "rowForcustomfield_10103" and just it's contained a element "customfield_10103-val" place at next to "customfield_10102-val" with some margin. so, after that it will look as below:
`<li id="Li1" class="item">
<div class="wrap">
<strong title="select list" class="name">select list:</strong>
<div id="Div1" class="value type-select editable-field inactive"
data-fieldtype="select" title="Click to edit">
final2 <span class="overlay-icon icon icon-edit-sml" />
</div>
<div id="Div2" class="value type-select editable-field inactive"
data-fieldtype="select" title="Click to edit">
1 <span class="overlay-icon icon icon-edit-sml" />
</div>
</div>
</li>`
Please also let me know on this.
have tried below but unable to change position:
if(AJS.$("rowForcustomfield_10102").length > 0)
{
AJS.$("customfield_10102-val").after( AJS.$('customfield_10103-val'));
AJS.$('customfield_10103-val').css({ 'margin-left': '40px','width':'80px' })
AJS.$('customfield_10102-val').css({ 'width': '80px' });
AJS.$("#rowForcustomfield_10102 .name").html(null);
AJS.$("#rowForcustomfield_10103 .name").html(null);
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With