1

これをどのように行いますか？私はJavaScriptの達人ではないので、解決策が見つかりません...

プロジェクト管理と設計に使用されるプロジェクト予算の割合を示すスライダーがあります。したがって、デフォルトの立場では、プロジェクト管理と設計が 50/50 で分割されます。彼らがそれを一方向にスライドさせた場合、パーセンテージが設計に歪められ、逆に PM に歪められます...あなたはアイデアを得る.

したがって、通常のラベルは 0 ～ 100 の範囲を示します。たとえば、プロジェクト管理の予算の割合にそれを使用できます。

ここで、デザイン パーセンテージを反映する 2 番目のラベルが必要です。(100 から PM ラベル値を引いたものはどれでしょう。) どのようにしますか?

これが私がこれまでに持っているものです：

Campaign Budget:
<br />
<table>
    <tr>
        <td>
            Total Dollars:
        </td>
        <td colspan="3">
            Use the slider to modify the percentage between Project Management and Design.
        </td>
    </tr>
    <tr>
        <td>
            <asp:TextBox ID="totaldollarsbid" runat="server"></asp:TextBox>
        </td>
        <td>
            WANT DESIGN PERCENTAGE LABEL HERE
        </td>
        <td>
            <asp:TextBox ID="SliderBox" runat="server" Text="50" ClientIDMode="Static"></asp:TextBox>
            <ajaxToolkit:SliderExtender ID="SliderExtender" runat="server" TargetControlID="SliderBox"
                Minimum="0" Maximum="100" BoundControlID="SliderLabel" />
        </td>
        <td>
            <asp:Label ID="SliderLabel" runat="server"></asp:Label>
        </td>
    </tr>
</table>
4

2 に答える 2

0

このラベルを、デザインの価値が必要な場所に配置し<asp:Label runat="server" ID="DesignValueLabel" Text="50" />ます。ページに以下のスクリプトを追加します。

<script type="text/javascript">
    function pageLoad() {
        var extender = $find("<%= SliderExtender.ClientID %>");
        extender.remove_valueChanged(updateDesignValue);
        extender.add_valueChanged(updateDesignValue);
    }

    function updateDesignValue(sender, eventArgs) {
        var design = 100 - sender.get_Value();
        $get("<%= DesignValueLabel.ClientID %>").innerHTML = design;
    }
</script>

スライダーが更新パネルに配置されていない場合は、pageLoad関数の代わりに以下のスクリプトを使用できます (ScriptManager または ToolkitScriptManager コントロールの後に配置する必要があります)。

Sys.Application.add_load(function () { $find("<%= SliderExtender.ClientID %>").add_valueChanged(updateDesignValue); });
于 2012-11-20T21:04:13.767 に答える
0

OK、私はこれを試しました...「デザイン値を更新する」ボタンを追加しました...ボタンをクリックすると、jquery関数がデザインラベルを100マイナスPMラベルに更新します...

<asp:TextBox ID="SliderBox" runat="server" Text="50"></asp:TextBox>

<ajaxToolkit:SliderExtender ID="SliderExtender" runat="server"
TargetControlID="SliderBox"
Minimum="0"
Maximum="100" Steps="21"
BoundControlID="SliderPMLabel" 

/>
<asp:Button ID="btnTest" runat="server" Text="Update Design Value" />
<br /> <asp:Label ID="SliderPMLabel" runat="server"></asp:Label>% Project Management
<br /><asp:Label ID="SliderDesLabel" runat="server"></asp:Label>% Design

<script type="text/javascript">
$(function () {


    $('#<%= btnTest.ClientID %>').click(function () {
    var labelText = $('#<%= SliderPMLabel.ClientID %>').html();
        $('#<%=SliderDesLabel.ClientID%>').html(100 - labelText);
        return false;
    });


}); 


</script>

そして、それはうまくいきます。しかし、スライダーの移動に合わせてデザイン ラベルの値を動的に変更したいと考えています。

1 つのポイントは、ページの読み込み時に発生しないことです... ユーザーがドロップダウンからクライアントを選択すると、この選択が表示されます。

于 2012-11-26T17:23:23.267 に答える