asp.net控件2文本框与ajax滑块扩展器控件

时间:2017-12-15 06:08:48

标签: javascript c# jquery asp.net ajax

假设我有两个可以由ajaxToolkit控制的文本框:SliderExtender。一个带有滑块的文本框很好。现在我需要一些自定义,如果我增加滑块,那么第一个文本框值会降低&反之亦然。对不起我知道我是否能正确发布我的问题。但我想制作如下面的参考链接(https://360rewards.standardchartered.com/in/award/detail/amazon-all-new-kindle-paperwhite-2015-wifi-3g/58361)所示的内容。

<form id="form1" runat="server">
        <asp:ScriptManager ID="sc1" runat="server"></asp:ScriptManager>
    <div>
        <asp:TextBox ID="txt1" runat="server"></asp:TextBox>
        <asp:TextBox ID="txt2" runat="server"></asp:TextBox> &nbsp;&nbsp; 
        <asp:TextBox ID="txt3" runat="server"></asp:TextBox>

        <ajaxToolkit:SliderExtender ID="SliderExtender1" runat="server" Minimum="5" Maximum="50" TargetControlID="txt1" BoundControlID="txt2" />
    </div>
    </form>

enter image description here

1 个答案:

答案 0 :(得分:1)

你可以用javascript做到这一点 像这样的东西

var firstTb = document.getElementById("txt1");
    firstTb.addEventListener("change", changeValue);

    function changeValue() {
        var max = 100;//your max slider value
        var current = parseInt(firstTb.value);

        document.getElementById("txt3").value = (max - current)/*here your calculations */;
    }

好吧,我想,我找到了动态变化的解决方案 添加BehaviorID =&#34; sliderBehavior&#34;你的滑块扩展器和js

function pageLoad(sender, e) {
        var slider = $find('sliderBehavior');
        slider.add_valueChanged(onValueChanged);
    }

    function onValueChanged(sender, e) {
        var max = 100;
        var current = parseInt(sender._value);
        document.getElementById("txt3").value = (max - current)/*calculations*/;
    }