[geebee]

I am dynamically adding content to a panel using this code, but why is it rendering differently in the Test Center (image attached); also, I can’t get it to do a vertical-align to the top.

I am running 2.0.3. The code is fairly simple and you can see the results on the image

$(“m1-Start-pnlJsonOutput”).css(‘vertical-align’, ‘top’);
var pnlJsonOutput = data.return1 + “<br />”;
pnlJsonOutput += data.SessionStatus + “<br />”;
pnlJsonOutput += data.StartTime + “<br />”;
pnlJsonOutput += data.EndTime + “<br />”;
pnlJsonOutput += data.FirstName + “<br />”;
pnlJsonOutput += data.LastName + “<br />”;
$(“#m1-Start-pnlJsonOutput”).html(pnlJsonOutput);

Attachments:

You must be logged in to view attached files.

[support-octavio]

Hi,

It seems like you forgot the prefix selector: #

$(“#m1-Start-pnlJsonOutput”).css(‘vertical-align’, ‘top’);
var pnlJsonOutput = data.return1 + “<br />”;
pnlJsonOutput += data.SessionStatus + “<br />”;
pnlJsonOutput += data.StartTime + “<br />”;
pnlJsonOutput += data.EndTime + “<br />”;
pnlJsonOutput += data.FirstName + “<br />”;
pnlJsonOutput += data.LastName + “<br />”;
$(“#m1-Start-pnlJsonOutput”).html(pnlJsonOutput);

[geebee]

Actually, the issue here was two fold – first the missing #, but more importantly I should have put the content in the scrolling container and not the div itself.

Once I did this, the content which was about 3 times the height of the panel started scrolling inside the panel. However, is there a way to make the vertical scroll bar always appear on the right? It seems that it only appears when you swipe the panel. Without it appearing on the side of the panel, there is no visual queue to the user that this would be scrollable content.

[geebee]

regarding missing the # sign:

$(“#m1-Start-pnlJsonOutput”).css(‘vertical-align’, ‘top’);

it was actually the line height attribute of the div being almost the same height as the div panel itself that was causing the single line to appear in the panel as opposed to all the content.

[Author]

Posts