Revision history [back]

Leaving the slider value editable

I would like to have a slider with an optional editable value. I have found that the first version gives me that option but the second just prints the value of "h" to the right (I can't click on it and edit it - it must be changed by messing with the slider).

@interact
def _(h=(0.1,(-1,1))):
    h

@interact
def _(h=slider(-1,1,default=0.1,step_size=0.001,label='$h=$')):
    h

I would just use the first block of code except that then I cannot give it a nicely formatted label or adjust other attributes (like step size).

Thanks!

Leaving the slider value editable

@interact
def _(h=(0.1,(-1,1))):
    h

@interact
def _(h=slider(-1,1,default=0.1,step_size=0.001,label='$h=$')):
    h

I would just use the first block of code except that then I cannot give it a nicely formatted label or adjust other attributes (like step size).

Thanks!

Edit: I am running Windows 10. Using both Chrome and Microsoft Edge, I have the same issue. The first slider allows me to click on and edit the h value on the right while the second just displays the h value to the right. Here's the full html file I'm using to load up the interact...

<!DOCTYPE HTML>
<html>
  <title>Slider</title>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>SageMathCell</title>
    <script src="https://sagecell.sagemath.org/static/embedded_sagecell.js"></script>
    <script>$(function () {
    sagecell.makeSagecell({inputLocation:  '#mycell',
                           template:       sagecell.templates.minimal,
                           autoeval:       true,
                           linked:         true,
                           hide:           ["evalButton"]
                           //evalButtonText: 'Recompute'
                          });
    }); 
    </script>
  </head>

<body>

<div id="mycell"><script type="text/x-sage">
@interact
def _(h=(0.1,(-1,1))):
    h

@interact
def _(h=slider(-1,1,default=0.1,step_size=0.001,label='$h=$')):
    h
</script>
</div>

</body>
</html>