I have created a custom SharePoint 2010 web part whose purpose is to wrap other webparts with JQuery to create an accordion. It works, however the styling of the imported webparts look like they lost some CSS.
And here's how I'm importing it
WebPart wp = this.WebPartManager.WebParts[w]; temp.WriteLine("<div class=\"noindex ms-wpContentDivSpace\" id=\"WebPartWPQ2\" >"); wp.ChromeState = PartChromeState.Normal; wp.ChromeType = PartChromeType.TitleOnly; wp.RenderControl(temp); //re-render the WP to this control wp.Hidden = true; //now hide the first initial wp temp.WriteLine("</div>");
Looking at the html, they are quite similar, and I added the above div tag to match them up. Am I missing something? Do you want the actual HTML as well? Let me know!
I switched from the above code and decided to use JQuery with AppendTo. I am doing the following jQUery
var thewpDiv = $("#" + wpDivID);
where wpDivID is div_a0044a86-16b3-4bf7-bb2b-f756f09ef1be, ID of the div I know about from the following
<p></p> <div class="ms-rtestate-read ms-rte-wpbox"> <div class="ms-rtestate-notify ms-rtestate-read a0044a86-16b3-4bf7-bb2b-f756f09ef1be" id="div_a0044a86-16b3-4bf7-bb2b-f756f09ef1be"> <table style='width:100%' cellpadding='0' cellspacing='0'> <tr> <td id="MSOZoneCell_WebPartWPQ2"...
When I look at the html() of the element, it startes at the table tag. I then grab .parent() of this item and I can see the div of my ID. So then I try .parent().parent() hoping to get the top DIV, but then I grab the entire content area, including other web parts. It appeaers to skip over the top div as noted above.