Ajax Slider Extender - Handle width set dynamically

Last post 09-11-2007 7:16 AM by paul.vencill. 7 replies.

Sort Posts:

  • Ajax Slider Extender - Handle width set dynamically

    09-07-2007, 6:26 AM
    • Member
      1 point Member
    • lukaswe
    • Member since 09-07-2007, 10:08 AM
    • Posts 9

    Hello,

    I want to set sliderextender (Ajax) handle width dynamically from vb.net.

    For example, I count something in vb.net, sign it to any variable and then I want the sliderextender handle to have width assign dynamically with value that I previously counted.

    My question is: how to change css style dynamically from vb.net. My css is:

    .slider-handle { position: absolute; background: url('Images/dot.gif') repeat; height: 18px; width: 50px; }

    .slider-rail {position: relative; background: url('Images/some_gif.gif') repeat-x; height: 18px; width: 800px; }

    In aspx I have assign these styles to sliderextender:

    <ajaxToolkit:SliderExtender

    ID="SliderExtender1" runat="server" TargetControlID="txtSlider" BoundControlID="lblSliderBound" RailCssClass="slider-rail" HandleCssClass="slider-handle" BehaviorID="slid"

    Steps="3"></ajaxToolkit:SliderExtender>

    and I want to change width value dynamically from vb.net

    Is it posibble and if so, how to do it?

  • Re: Ajax Slider Extender - Handle width set dynamically

    09-07-2007, 7:58 AM
    • Contributor
      6,620 point Contributor
    • paul.vencill
    • Member since 02-01-2006, 7:57 AM
    • Gaithersburg, MD
    • Posts 1,350

    Well, you have four options. 

    First, you can set it w/o using CSS if you want by writing your value to the Length property of the slider (SliderExtender1.Length). 

    Second, you can embed CSS in your page using <style> tags (blech) and if you choose this Dark Path you can then write your value to the class you declared like so:   width : <%= yourValue %>px;

    Third, if you serve  your CSS file from a custom handler (ashx) or other .Net-recognized file type, you can inject code right into the text as it's being streamed out.

    Finally, if you have control of your IIS, you can map all extensions to the asp.net runtime and have ASP.Net parse CSS files looking for server-side markup to inject as if it were an aspx page.

    Help those who have helped you... remember to "Mark as Answered"
  • Re: Ajax Slider Extender - Handle width set dynamically

    09-07-2007, 9:18 AM
    • Member
      1 point Member
    • lukaswe
    • Member since 09-07-2007, 10:08 AM
    • Posts 9

    Hi, first of all, thanks for response. I didn't explain exactly what I want to do. I want to do something like that: I declare (in webconfig) variable and set it as maxvalue = 100. I have two textboxes, where I put width and height of gridview (so if I put Width: 10, Height: 10 I wil have 10x10=100 elements in gridview). I click "Show gridview button" and then gridview loads data from database to its cells. Now I see gridview with 100 elements (10x10). I have also two sliderextenders to scroll this gridview vertically and horizontally). Each time I scroll gridview new set of columns or rows are supposed to load from database. I have variable maxvalue that I can change any time. And my problem is: how to set sliderextenders handle width in way that it's width is dependent on maxvalue. For example: if maxvalue is equal 1000 then sliderextenderhandle is shorter than maxvalue equals 100. I mean that it shoul work like scrollbars in excel or any Windows programme or like div in html.

  • Re: Ajax Slider Extender - Handle width set dynamically

    09-08-2007, 1:59 PM
    • Contributor
      6,620 point Contributor
    • paul.vencill
    • Member since 02-01-2006, 7:57 AM
    • Gaithersburg, MD
    • Posts 1,350

    Well, you simply retrieve maxvalue from the web.config or whereever and in your page_load method or wherever, you simply change the .Length value to the lesser of the two values.  Or are you talking about making the change clientside?

    Help those who have helped you... remember to "Mark as Answered"
  • Re: Ajax Slider Extender - Handle width set dynamically

    09-10-2007, 2:56 AM
    • Member
      1 point Member
    • lukaswe
    • Member since 09-07-2007, 10:08 AM
    • Posts 9

    Hi, thank you for Your response once more. I don't want to change rail's lenght, but handle width (I think that I could call it incorrectly - I meant this small image that is used when you click on it and drag to next value - I called it handle, but I don't know it in English I thought it is handle). It can be changed in clientside. I have to change this value dynamically.

  • Re: Ajax Slider Extender - Handle width set dynamically

    09-10-2007, 9:08 AM
    Answer
    • Contributor
      6,620 point Contributor
    • paul.vencill
    • Member since 02-01-2006, 7:57 AM
    • Gaithersburg, MD
    • Posts 1,350

    ahhhhhh... wow, no that was my bad entirely.  You said 'handle' handle is the right word, and I just was dense.  Sorry. 

    Ok, getting the HANDLE is a touch harder, but not by much.  If you want to affect the handle from the server (which I gather you do) then your best bet is to use the handleCssClass and handleImageUrl properties of the control.

    What I'd suggest, just a quick thought on the fly (untested) is something like a dynamically generated css.  You can do that one of two ways off the top of my head.  First (easiest, least SEO-friendly) is to embed a small Style section in the page that has its contents generated by you.  One way is to put a server-side style element in the <head> like so:

    <head runat="server">
        <title>Style page</title>
        <style type="text/css" id='dynamic' runat="server"/>    
    </head>

     You can then generate the contents of that style element in the code-file by setting its InnerText property; here's one way:

    public partial class style_test_Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
           dynamic.InnerText = GetStyle();
        }
        
        private string GetStyle()
        {
          System.Text.StringBuilder sb = new System.Text.StringBuilder(".dynamicHandle");
          sb.Append("{");
          sb.Append("background-repeat : repeat-x;");
          sb.Append(String.Format("width : {0}px;",GetWidth().ToString()));
          sb.Append("}");
          return sb.ToString();
        }
        
        private int GetWidth()
        {
          return 200;
        }
    }

     Another way to do all this that's somewhat more flexible is to create an ashx file that sets its content-type to text/css and outputs whatever you need.  An example of that is here: http://cfouquet.blogspot.com/2006/06/making-dynamic-css-content-with-aspnet.html though he uses an aspx page insetad of a generic handler (go w/ the handler; it's got a lighter memory footprint on your server).

    Hope this helps.

    Paul

    Help those who have helped you... remember to "Mark as Answered"
  • Re: Ajax Slider Extender - Handle width set dynamically

    09-11-2007, 3:56 AM
    • Member
      1 point Member
    • lukaswe
    • Member since 09-07-2007, 10:08 AM
    • Posts 9

    Hi, thank You very much for Your solution. It works:). I had to modify it a little for my purpose:

    Dim getRailWidth As Integer

    getRailWidth = colsAmount * 65

    Dim getHandleWidth As Integer

    getHandleWidth = Math.Ceiling(getRailWidth / Me.SliderExtender2.Steps)

    Dim sb As New System.Text.StringBuilder

    sb.Append(".handle")

    sb.Append("{")

    sb.Append("position: absolute;")

    sb.Append("background: url('Images/dot.gif') repeat;")

    sb.Append("height: 18px;")

    sb.Append([String].Format("width : {0}px;", getHandleWidth.ToString()))

    sb.Append("}")

    sb.Append(" .rail")

    sb.Append("{")

    sb.Append("position: relative;")

    sb.Append("background: url('Images/some_gif.gif') repeat-x;")

    sb.Append("height: 18px;")

    sb.Append([String].Format("width : {0}px;", getRailWidth.ToString()))sb.Append("}")

    style = sb.ToString

    Me.dynamic.InnerText = style

     

    I have to find how to get gridview column width dynamically either;), but one problem is gone. Thanks

  • Re: Ajax Slider Extender - Handle width set dynamically

    09-11-2007, 7:16 AM
    • Contributor
      6,620 point Contributor
    • paul.vencill
    • Member since 02-01-2006, 7:57 AM
    • Gaithersburg, MD
    • Posts 1,350

    Glad I could help!

    Help those who have helped you... remember to "Mark as Answered"
Page 1 of 1 (8 items)