ASP.NET链接按钮更改jQuery滑块

时间:2014-02-12 12:21:30

标签: c# javascript jquery asp.net webforms

我的页面中有两个jQuery滑块 - 用户将是宽度和高度,然后单击一个按钮,该按钮应转到New Url,其值为querystring参数。

所以我的页面上有两个asp HiddenFields,我也设置了滑块的值 - 这似乎工作正常。

<asp:linkbutton ID="bmiLink" class="action-button" Text="Click for BMI" ToolTip="View your BMI" runat="server" OnClick="btnBMI_Click" />

然后,我的代码背后有以下C#:

    protected void btnBMI_Click(object sender, EventArgs e)
    {
        //Get Values from Hidden Fields
        string weight = weight .Value;
        string height= height.Value;

        bmiLink.PostBackUrl = string.Format("/BMIPage?{0}={1}&{2}={3}", QueryStringConstants.Weight, weight , QueryStringConstants.Height, height);
    }

当我第一次加载页面时,滑块值都为零,如果我将鼠标悬停在按钮上,则链接显示为 -

javascript: __doPostBack('ct100$ct100$bodyContent$formContent$bmiLink',")

如果我将滑块值更改为重量150和高度180,我希望按钮链接更新。实现这一目标的最佳方法是什么?

现在的工作方式 - 我必须单击获取值的按钮,然后回发到页面并将滑块重置为0,但更新按钮上的链接以包含正确的查询参数。那么有没有一种方法可以轻松地动态设置由滑块设置的值驱动的按钮上的链接?

2 个答案:

答案 0 :(得分:1)

好吧,您可以考虑在客户端上执行所有操作,因此在按钮中执行:

<asp:LinkButton .. OnClientClick="postback(this, event);" />

function postback(sender, e) {
   //you may have to use e.stopPropagation() and e.preventDefault() to prevent the default postback operation

   var val = /* jquery expression to get the value */
   __doPostBack("<%= Button.UniqueID %>", val);
}

然后它会从客户端获取价值。然后,您可以将其更改为您想要的任何内容。

答案 1 :(得分:0)

将btnBMI_Click事件处理程序中的最后一行更改为:

Response.Redirect(string.Format("http://domain.com/BMIPage?{0}={1}&{2}={3}", QueryStringConstants.Weight, weight , QueryStringConstants.Height, height));