javascript help needed, custom asset search box displayed in the wrong location
Mark_Blok
Partner IT Monkey ✭
We upgrade our portal from 8.1.2 to 9.4.2 and our custom asset search box wich was deployed to the navbar on the top of the page is now displayed on top of the user settings instead of left to it (where it was with the old version of the portal)
The code used succesfully was: $('.navbar-right').after("<ul class='nav navbar-nav' style='padding-top:4px;padding-right:20px'><input id='searchAsset' class='navbar__search--input form-control' type='text' placeholder='Search HW Asset'></ul>");
0
Answers
I have to start with a caveat, that my top nav bar is heavily customized, and that although I do not think my customizations would have any bearing on this whatsoever, they might.
Ok, with that out of the way, I think you have a CSS issue, not a JS issue. I ran your code in the console and it seemed to work flawlessly. It created a search box to the left of the user settings (more specifically, to the left of some other menu items I had added to the left of the user settings). Changing to the .before method put it perfectly to the right of the user settings.
My strong suspicion here is that you have some other CSS applied (or I have the reverse of this going on...) that is causing this not to float properly or that has interfered with the display attribute (e.g. display: block / inline-block / etc.)
If someone with a less-customized portal runs this, it would be interesting to note whether they have the same experience I do, or if they have yours.
I have to start with a caveat, that my top nav bar is heavily customized, and that although I do not think my customizations would have any bearing on this whatsoever, they might.
Ok, with that out of the way, I think you have a CSS issue, not a JS issue. I ran your code in the console and it seemed to work flawlessly. It created a search box to the left of the user settings (more specifically, to the left of some other menu items I had added to the left of the user settings). Changing to the .before method put it perfectly to the right of the user settings.
My strong suspicion here is that you have some other CSS applied (or I have the reverse of this going on...) that is causing this not to float properly or that has interfered with the display attribute (e.g. display: block / inline-block / etc.)
If someone with a less-customized portal runs this, it would be interesting to note whether they have the same experience I do, or if they have yours.
@Tom_Hendricks Thanks for the quick reply. I renamed my CSS file so I could see the result without any custom.css. Unfortunately the search box was still on top of the user settings. Is it an option for you to test the code with your css disabled. I am curious if that gives you the same issue!