The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Javascript Code to "re-insert" a profile field in a different spot?

+2
JScript
Bedlam
6 posters

Page 1 of 2 1, 2  Next

Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam April 13th 2015, 11:35 am

Technical Details

Forum version : phpBB2
Position : Founder
Concerned browser(s) : Google Chrome
Who the problem concerns : Yourself
Forum link :   www.gasrforum.com

Description of problem

Alright I have been searching for a code like this but I have no idea if it's possible or how to go about achieving what I want.

I would like the advanced profiles on forumotion to be a bit better organized? On my forum, we have a lot custom fields which make the profile page cluttered. I was wondering if it would be possible to create additional tabs where the "visitor messages / profile / statics" and somehow add the customizable fields to those pages?

Javascript Code to "re-insert" a profile field in a different spot? B25a8eb2696c0dfcb5837961130525fe

If nothing else, would it be possible to move custom fields to the right side of the page instead of on the left?

UPDATE----

Right so since nobody is answering this, I've started to try and make some sort of code pieced together from other codes I have found.

So here's the first thing I've started doing, using a javascript to add code to the userpage, I have hidden the section I want moved underneath the display picture.

Javascript Code to "re-insert" a profile field in a different spot? 880eac3f751ead86760c8db4c5845ecf

to ----> 

Javascript Code to "re-insert" a profile field in a different spot? Bd20b6737a4c5ff703882cd8a8a98548


Using this javascript:

Code:
jQuery(document).ready(function(){
         if(window.location.pathname.indexOf("/u68")!==-1){
          jQuery('<style>body{background: url("http://media.tumblr.com/6233adc1e97adcc10105f1988b8a2465/tumblr_inline_mns3reYdBr1qz4rgp.gif") }

dl#field_id20 {  
     visibility: hidden; !important;
}</style>').appendTo(document.head);
         } else return;
        });

Then editing the user stastics code made by @Ange Tuteur (although I don't really understand how javascripts work so I left a lot of unnecessary things in the code so it wouldn't break).

I added the "awards" underneath the display picture.

Code:
window.location.pathname.match(/\/u\d+/) && $(function() {
  var b = document.createElement('DIV'),
  lang = {
    activity : 'Awards'  }, placeholder = '<span class="gen"><dl id="field_id20"><dt><dd></dd></dt></dl></span>';
  

  document.getElementById('wrap') && (b.innerHTML = '<div class="module"><div class="inner"><span class="corners-top"><span></span></span><div class="h3">'+lang.activity+'</div>'+placeholder+'<span class="corners-bottom"><span></span></span></div></div>');
  document.getElementById('ipbwrapper') && (b.innerHTML = '<div class="module borderwrap"><div class="maintitle"><h3>'+lang.activity+'</h3></div><div class="box-content profile center">'+placeholder+'</div></div>');
 

 $('.bodylinewidth').length && (b.innerHTML = '<div style="height:3px;"></div><table class="forumline" border="0" cellpadding="0" cellspacing="1" width="100%"><tbody><tr><td class="catLeft"><span class="genmed module-title">'+lang.activity+'</span></td></tr><tr><td class="row1 gensmall" align="center">'+placeholder+'</td></tr></tbody></table>', bb2 = true);  

$('#profile-advanced-right .module:first, td[width="300"] .forumline:first').after(b);
  $.get('/viewonline',function(data) {
    var p = b.getElementsByTagName('P')[0], c = 'tr:has(a[href="/u'+window.location.pathname.match(/u(\d+)/)[1]+'"]) td';
    bb2 && (c = '.three-col table:has(.nav) + table ' + c);
    p.innerHTML = $(c+':last',data).html();
    !p.innerHTML.length ? p.innerHTML = '<a href="#" onclick="return false;" class="inactive">'+lang.offline+'</a><div class="lastactive">'+lang.last+' : '+lang.none+'</div>' : p.innerHTML += '<div class="lastactive">'+lang.last+' : ' + $(c+':eq(1)',data).html() + '</div>';
  });
});


Last edited by Bedlam on May 27th 2015, 6:26 am; edited 3 times in total
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam April 20th 2015, 11:48 pm

Bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by JScript April 21st 2015, 12:10 am

Bedlam wrote:Bump
Hello!

This is possible, below you will see the code I use to implement new tabs and various other things:
Code:

if (location.pathname.indexOf('/u') == 0) {
    var _profile = setInterval(function() {
        if (document.getElementById('profile-advanced-right') !== null) {
            var oTarget = jQuery('[id^=field_id]'),
                iLen = oTarget.length,
                index = 0;
            for (; index < iLen; index++) {
                var oThis = jQuery(oTarget[index]);
                oThis.attr('id', 'JS_' + oThis.attr('id'));
            };
            clearInterval(_profile);
            $('[id^=JS_field_id]').each(function() {
                if ($(this).find('.field_editable').is('span, div')) {
                    $(this).hover(function() {
                        if ($(this).find('.field_editable.invisible').is('span, div')) {
                            $(this).find('.field_editable').prev().addClass('ajax-profil_hover').parent().addClass('ajax-profil_parent').append('<div class="ajax-profil_edit"><img src="http://2img.net/i/fa/invision/../edit.png" /></div>');
                            $(this).find('.ajax-profil_edit').attr({
                                alt: "{L_FIELD_EDIT_VALUE}",
                                title: "{L_FIELD_EDIT_VALUE}"
                            }).click(function() {
                                $(this).prev().prev().removeClass('ajax-profil_hover').addClass('invisible').next().removeClass('invisible').append('<img src="http://2img.net/i/fa/invision/../valid.png" class="ajax-profil_valid" />').find('input,select');
                                $(this).prev().find('.ajax-profil_valid').attr({
                                    alt: "{L_VALIDATE}",
                                    title: "{L_VALIDATE}"
                                }).click(function() {
                                    var content = new Array();
                                    $(this).parent().find('[name]').each(function() {
                                        var type_special = $(this).is('input[type=radio],input[type=checkbox]');
                                        if ((type_special && $(this).is(':checked')) || !type_special) {
                                            content.push(new Array($(this).attr('name'), $(this).attr('value')));
                                        }
                                    });
                                    var id_name = $(this).parents('[id^=JS_field_id]').attr('id');
                                    var id = id_name.substring(11, id_name.length);
                                    console.log('id_name: ' + id_name + '\n' + 'id: ' + id);
                                    $.post(
                                        "{U_AJAX_PROFILE}", {
                                            id: id,
                                            user: "{CUR_USER_ID}",
                                            active: "{CUR_USER_ACTIVE}",
                                            content: $.toJSON(content),
                                            tid: "{TID}"
                                        },
                                        function(data) {
                                            $.each(data, function(i, item) {
                                                $('[id=JS_field_id' + i + ']').find('.field_uneditable').html(item).end().find('.ajax-profil_valid').remove().end().find('.field_editable').addClass('invisible').end().find('.field_uneditable').removeClass('invisible');
                                            });
                                        },
                                        "json"
                                    );
                                });
                                $(this).remove();
                            });
                        }
                    }, function() {
                        if ($(this).find('.field_editable.invisible').is('span, div')) {
                            $(this).find('.field_editable').prev().removeClass('ajax-profil_hover');
                            $(this).find('.ajax-profil_edit').remove();
                        }
                    });
                }
            });

        };
    }, 50);
}

Give us more details of what you want to implement, because I saw that in addition to new tabs you want to add fields in these tabs, but would be new or existing fields?

So long,

JS
JScript
JScript
Forumember

Male Posts : 741
Reputation : 175
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam April 21st 2015, 6:59 am

Thank you so much for the reply and the code!
I am quite new to navigating javascript codes so I have no idea what all that does.
I tried implementing the unedited code into my forum and nothing happened.

I would preferably like existing fields on those newly created tabs.
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by SLGray April 21st 2015, 7:42 am

Is JavaScript Management on?


Javascript Code to "re-insert" a profile field in a different spot? Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam April 21st 2015, 9:07 am

I assume you mean this?

Javascript Code to "re-insert" a profile field in a different spot? C5c2362379e5a35f087a99beffa37f14
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam April 23rd 2015, 9:33 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam April 27th 2015, 3:23 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 1st 2015, 9:56 pm

bumps
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by brandon_g May 1st 2015, 10:07 pm

Bedlam wrote:I assume you mean this?

Javascript Code to "re-insert" a profile field in a different spot? C5c2362379e5a35f087a99beffa37f14
Yes thats it Smile.

-Brandon
brandon_g
brandon_g
Manager
Manager

Male Posts : 10106
Reputation : 923
Language : English
Location : USA

https://www.broadcastingduo.com

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 6th 2015, 7:34 am

Yes it's turned on!!
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 7th 2015, 9:59 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 8th 2015, 10:17 am

Right so since nobody is answering this, I've started to try and make some sort of code pieced together from other codes I have found.

So here's the first thing I've started doing, using a javascript to add code to the userpage, I have hidden the section I want moved underneath the display picture.

Javascript Code to "re-insert" a profile field in a different spot? 880eac3f751ead86760c8db4c5845ecf

to ----> 

Javascript Code to "re-insert" a profile field in a different spot? Bd20b6737a4c5ff703882cd8a8a98548


Using this javascript:

Code:
jQuery(document).ready(function(){
         if(window.location.pathname.indexOf("/u68")!==-1){
          jQuery('<style>body{background: url("http://media.tumblr.com/6233adc1e97adcc10105f1988b8a2465/tumblr_inline_mns3reYdBr1qz4rgp.gif") }

dl#field_id20 {  
     visibility: hidden; !important;
}</style>').appendTo(document.head);
         } else return;
        });

Then editing the user stastics code made by @Ange Tuteur (although I don't really understand how javascripts work so I left a lot of unnecessary things in the code so it wouldn't break).

I added the "awards" underneath the display picture.

Code:
window.location.pathname.match(/\/u\d+/) && $(function() {
  var b = document.createElement('DIV'),
  lang = {
    activity : 'Awards'  }, placeholder = '<span class="gen"><dl id="field_id20"><dt><dd></dd></dt></dl></span>';
  

  document.getElementById('wrap') && (b.innerHTML = '<div class="module"><div class="inner"><span class="corners-top"><span></span></span><div class="h3">'+lang.activity+'</div>'+placeholder+'<span class="corners-bottom"><span></span></span></div></div>');
  document.getElementById('ipbwrapper') && (b.innerHTML = '<div class="module borderwrap"><div class="maintitle"><h3>'+lang.activity+'</h3></div><div class="box-content profile center">'+placeholder+'</div></div>');
 

 $('.bodylinewidth').length && (b.innerHTML = '<div style="height:3px;"></div><table class="forumline" border="0" cellpadding="0" cellspacing="1" width="100%"><tbody><tr><td class="catLeft"><span class="genmed module-title">'+lang.activity+'</span></td></tr><tr><td class="row1 gensmall" align="center">'+placeholder+'</td></tr></tbody></table>', bb2 = true);  

$('#profile-advanced-right .module:first, td[width="300"] .forumline:first').after(b);
  $.get('/viewonline',function(data) {
    var p = b.getElementsByTagName('P')[0], c = 'tr:has(a[href="/u'+window.location.pathname.match(/u(\d+)/)[1]+'"]) td';
    bb2 && (c = '.three-col table:has(.nav) + table ' + c);
    p.innerHTML = $(c+':last',data).html();
    !p.innerHTML.length ? p.innerHTML = '<a href="#" onclick="return false;" class="inactive">'+lang.offline+'</a><div class="lastactive">'+lang.last+' : '+lang.none+'</div>' : p.innerHTML += '<div class="lastactive">'+lang.last+' : ' + $(c+':eq(1)',data).html() + '</div>';
  });
});


So my question is how do I insert the content from dl#field_id20 so that it will update itself for every individual??
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 9th 2015, 9:12 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 10th 2015, 8:20 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 11th 2015, 3:08 am

Is there anyone who know
:/
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Sir. Mayo May 11th 2015, 3:42 am

Sir. Mayo
Sir. Mayo
Forumember

Male Posts : 980
Reputation : 90
Language : English, Some french.
Location : you can also reach me on snoonet's irc server. I idle in #Techsupport Username is Vault108

http://sir-mayo.forumotion.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 11th 2015, 4:19 am

Yes I have actually looked at that topic before!
But it didn't work on my forum (I'm using phpBB2)
I'll try the code again since it's been a while since I tested it haha.


EDIT - I tested it again and no it still doesn't work for phpBB2
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 12th 2015, 2:11 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 12th 2015, 8:55 pm

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 13th 2015, 10:37 am

nump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 14th 2015, 8:43 am

Bump
TT
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 15th 2015, 12:47 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 17th 2015, 4:58 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 20th 2015, 8:23 am

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 27th 2015, 6:27 am

Another bump!!
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam May 28th 2015, 11:51 am

5ever bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam June 7th 2015, 12:30 pm

Still bump
TT
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by Bedlam June 13th 2015, 10:14 pm

bump
Bedlam
Bedlam
Forumember

Female Posts : 62
Reputation : 4
Language : English
Location : Canada

http://www.gasrforum.com/

Back to top Go down

Javascript Code to "re-insert" a profile field in a different spot? Empty Re: Javascript Code to "re-insert" a profile field in a different spot?

Post by SLGray June 13th 2015, 10:20 pm

Did @JScript solve some of your issues?


Javascript Code to "re-insert" a profile field in a different spot? Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Page 1 of 2 1, 2  Next

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum