更新面板导致css问题

时间:2015-10-16 16:36:21

标签: javascript css sharepoint updatepanel

首先,我很遗憾我在这里提出这个问题,因为问题出在我的sharepoint应用程序中,但我认为它与sharepoint无关,因此在这里要求有广泛的受众。我正在使用更新面板和内部更新面板有div我分配动态HTML。在html中有类似按钮,当点击时改变颜色。因此,请考虑加载了很多项目,每个项目都有类似按钮。当我点击按钮然后它从其他类似按钮中移除css时会发生什么。我在我的webpart中使用用户控件。这是html代码

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>

                <asp:HiddenField runat="server" ID="hdnFld" Value="Its working"/>
                <asp:HiddenField runat="server" ID="hdnFldLikeSpan" Value="Span like"/>
                <asp:Button runat="server" ID="btnSubmit" OnClick="btnSubmit_OnClick" style="display:none"/>

            <section id="ideas" class="container">
                <div id="divShowImages" class="row" style=""  runat="server" >

                </div>


                 <div class="row" >
                    <div >
                        <a  id="btnloadData"  runat="server" OnServerClick="btnloadData_Click">Load more data</a>

                    </div>
                </div>
                <div>

                </div>
            </section>
   </ContentTemplate>

            </asp:UpdatePanel>

这是我的风格

<style>
.ChangeColor {
     background:red !important
 } 
.ChangeColor *{color:white !important} 
.ChangeColor .heart:before,.ChangeColor .heart:after{background:white !important}
.quote .like-idea, .quote .like-idea:hover {
    background: red;
}
.quote .ChangeColor {
     background:black !important
 } 
.quote .ChangeColor *{color:white !important} 
.quote .ChangeColor .heart:before,.quote .ChangeColor .heart:after{background:white !important}

这是我的javascript代码

<script type="text/javascript">

function incrementNumber(id, name) {

    document.getElementById("<%= hdnFld.ClientID %>").value = id;
    document.getElementById("<%= hdnFldLikeSpan.ClientID %>").value = name;
    eval(<%=serversideEvent %>);
                    }

function incrementCounter(likes, spanName) {
     $('#' + spanName).parent().addClass('ChangeColor');
      document.getElementById(spanName).innerText = likes;

                    }

当呈现Html时,它会加载图像。在所有图像下面都有按钮。当您单击按钮时,它会增加计数器并更改颜色。该按钮只是一个名为btnSubmit的按钮。 现在我单击一个图像下方的按钮然后它会改变颜色。现在我点击其他图像下方的按钮,它会改变颜色,但现在它会删除其他按钮的颜色。我怎么能解决这个问题。请问是否有任何疑问。

2 个答案:

答案 0 :(得分:0)

所有字段都在同一个更新面板中,因此我认为它会在您进行回发时重新加载所有属性值。尝试将此属性存储在外部或尝试使用javascript / ajax执行操作。

[OFF]我无法帮助你聊天,因为我没有声望:你必须在Stack Overflow上有20个声望才能在这里谈谈

答案 1 :(得分:0)

使用更新面板时,请确保您需要的任何更新必须在更新面板中。如果它在同一个更新面板中,那么它将工作,但如果它在更新面板之外,那么它将不会被反映。为了使这个东西工作,你必须使用另一个更新面板,并从后面的代码更新(如果是这样的话)......

还有另外一点要注意,在更新面板触发css之后,如悬停等......将无效。对于这项工作,你必须重新分配所有的css / JS动作。