Adding row/image/div in registration table

Technical Details

Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Google Chrome
Who the problem concerns : Yourself
Forum link : ( link is hidden, you must reply to see )

Description of problem

Hello!

I would like to add either a separate row, or an image, or a DIV in the registration table. Basically - a title before specific profile settings.

After user has agreed to terms and conditions, a window with mandatory user details is displayed. I want to insert custom content here. The main issue - there are no ID's on TR elements. I have tried something like this:

Code:

//Code by KamiSama
$(document).ready(function(){
if(document.URL.indexOf("http://URL/register?agreed=true&step=2") >= 0){
$('#profile_field_7_7').css({"background-image": "url('https://i.solidfiles.com/BzmjXA3DzmWgV.png')", "height" : "60px", "width" : "260px"});

var insert = '<tr><td class="gen row1" align="left"><span><span style="color:#292929;">Kraujas</span>&nbsp;* : </span></td><td class="gensmall row2"><select class="gensmall" id="profile_field_7_7" name="profile_field_7_7" size="1" style="background-image: url(https://i.solidfiles.com/BzmjXA3DzmWgV.png); height: 60px; width: 260px;"><option value="">No choice</option><option value="0">Grynakraujė</option><option value="1">Grynakraujis</option><option value="2">Purvakraujė</option><option value="3">Purvakraujis</option><option value="4">Maišyta</option><option value="5">Maišytas</option><option value="6">Nevertėlė</option><option value="7">Nevertėlis</option><option value="8" selected="selected">Žiobaras</option></select><br><span class="gensmall">Kokia tavo personažo kilmė?</span></td></tr>';
var new_row = insert.parentNode.insertRow( insert.rowIndex + 1 );
new_row.insertCell(0).innerHTML = "test";
new_row.insertCell(1).innerHTML = "test2";
   
}
});

Background replacement works perfectly, yet adding a new row is a bit more difficult. Any ideas?

The only work around I thought of is creating a separate Image choice option with only one choice set already on default. The main issue with this:

- row1 (left side) still there. No way to delete it. Even setting on "only icon" during registration text shows up
- there is "selected choice" blue dot next to the option. Removing or chaining HTML does not allow user to ho ahead with registration.... EDIT:: found how to remove it without any harm to registration:

Code: $( "#profile_field_8_20 input" ).css("opacity", "0");

Hello,

You got the problem solved or you still need help? If you need to add a div to a certain element, you have to do something like this:

Code:

$("selector").append("<div></div>")

Yeah. I kinda did. Workarounds FTW ;D
Too bad there is no better way to do this.
But for time being this is SOLVED

P.S. If anyones interested, for the left side I used:

Code: $('#form_register span:contains("______________")').css("opacity", "0");

(Here the profile field name is "____________")