Ext.net在代码后面改变面板BodyCls

时间:2014-02-16 07:31:23

标签: asp.net extjs ext.net

请帮助我...我的aspx页面是:

<head runat="server">
<title></title>
<style type="text/css">
    .notApprovedComment
    {
        background-color:#FFF8C1;
    }
    .ApprovedComment
    {
        background-color:#FFFFFF;
    }
</style>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <ext:ResourceManager runat="server" ID="rc1" ViewStateMode="Enabled"> </ext:ResourceManager>
            <ext:Panel runat="server" ViewStateMode="Enabled" ID="pnlTest" Title="Comment" Width="655" BodyCls="notApprovedComment">
                <Content>  comment  </Content>
            </ext:Panel>
            <ext:Button runat="server" ViewStateMode="Enabled" ID="btnTest" Text="salam">
                <DirectEvents>
                    <Click OnEvent="btnTest_Click" ViewStateMode="Enabled" ></Click>
                </DirectEvents>
            </ext:Button>
        </div>
    </form>
</body>

后面的代码是:

protected void Page_Load(object sender, EventArgs e)
{

}
[DirectMethod]
protected void btnTest_Click(object sender, DirectEventArgs e)
{
        btnTest.Text = btnTest.Text + " edited";
        if (pnlTest.BodyCls == "ApprovedComment")
            pnlTest.BodyCls = "notApprovedComment";
        else if (pnlTest.BodyCls == "notApprovedComment")
            pnlTest.BodyCls = "ApprovedComment";
}

但点击分机:按钮... pnlTest.BodyCls只会更改一次,如果我再次点击ext:button pnl.BodyCls则不会改变!但ext:button正常工作!!!!

1 个答案:

答案 0 :(得分:1)

C#

[DirectMethod]
protected void btnTest_Click(object sender, DirectEventArgs e)
{
    btnTest.Text = btnTest.Text + " edited";
    X.Js.Call("triggerClass");
}

javascript(变体)

function triggerClass(){
    var panel = Ext.getCmp('pnlTest');
    if(Ext.select('.ApprovedComment').getCount() > 0)
        panel.removeBodyCls('ApprovedComment');
    else
        panel.addBodyCls('ApprovedComment');
}

以下是客户端示例http://jsfiddle.net/9LnYR/1/