struts2 jquery:从选项卡外部的tabbedpanel溢出中的ajax调用返回的html

时间:2013-04-11 04:35:55

标签: jquery struts2 struts2-jquery

我这里有一个泡菜。 我正在使用struts2-jquery的tabbedpanel。 我有多个标签,每个标签都通过ajax返回html内容。

我的问题是我返回的html似乎打破了选项卡式面板中选项卡的布局。选项卡结束,返回的html溢出选项卡结尾的外部和下方(视觉上)。

我检查了我的标签正在进行的ajax调用,并且返回的html是有效的。如果有一个额外的开放元素或额外的关闭元素,你可能会期望这种行为,但html看起来很完美。 以下是加载选项卡式面板的jsp页面示例 我让这个项目使用struts2 dojo插件,但发现struts2-jquery插件的tabbedpanel上的动画等更整洁。使用struts-dojo tabbedpanel返回这样的html工作得很好。 关于会导致这种情况的任何想法?

      <sj:tabbedpanel id="remotetabs" selectedTab="1" show="true" hide="'fade'" collapsible="true" sortable="true" cache="true">

        <s:url var="remoteUrlFourDay" action="fourdayforecast.action">
            <s:param name="name"><s:property value="name"/></s:param>
            <s:param name="zipcode"><s:property value="zipcode"/></s:param>
        </s:url>
        <sj:tab id="fourday" href="%{remoteUrlFourDay}" label="4 Day Forecast" errorText=" "/>

        <s:url var="remoteUrl24Hour" action="hourlyforecast.action">
            <s:param name="name"><s:property value="name"/></s:param>
            <s:param name="zipcode"><s:property value="zipcode"/></s:param>
        </s:url>
        <sj:tab id="two" href="%{remoteUrl24Hour}" dataType="html" label="24 Hour Forecast" errorText=" "/>

        <s:url var="remoteUrlTenDay" action="tendayforecast.action">
            <s:param name="name"><s:property value="name"/></s:param>
            <s:param name="zipcode"><s:property value="zipcode"/></s:param>
        </s:url>
        <sj:tab id="tenday" href="%{remoteUrlTenDay}" label="Ten Day Forecast"   errorText=" "/>

        <s:url var="remoteUrlTest" action="webcams.action">
            <s:param name="name"><s:property value="name"/></s:param>
            <s:param name="zipcode"><s:property value="zipcode"/></s:param>
        </s:url>
        <sj:tab id="test" href="%{remoteUrlTest}" label="Test" errorText=" "/>
    </sj:tabbedpanel>

根据Alexandr的要求,这是html。我尝试将它放在一个代码块中,但它的格式化很有趣所以我只是在我的Web服务器上托管了返回的html。 Fully generated Html from the page in question只需查看页面的来源即可查看html。 以下是html中用于返回的ajax

的2个css样式
.block {
width: 200px;
height: 160px;
margin: 5px 10px 10px 5px;
padding: 5px;
border: 5px solid #94BEFF;
float: left; }

#wrap {
background-color: white;
margin: 0 auto;
} 

layout problem with my project

0 个答案:

没有答案