I have the following line of code in jQuery:
$( "#amount-deposit" ).val( "" + $( "#slider-deposit" ).slider( "value" ) );
I'd like to apply toFixed(2) to amount deposit. I'm unsure how I can do this in this instance though, can anyone suggest how I might do this.
Thanks
Looking at the api:-
value()
Returns: Number
Get the value of the slider. This signature does not accept any
arguments. Code examples: Invoke the method:
var selection = $( ".selector" ).slider( "value" );
So, all you need to do is:-
$( "#amount-deposit" ).val( "" + $( "#slider-deposit" ).slider( "value" ).toFixed(2));
Related
I have this code http://jsfiddle.net/y8owze31/6/. I need to be able to apply a suffix to the string via a variable. The way I am doing it now is very primitive. What I mean is
$(function() {
var1 = "suffix"
$( "#slider-range-max" ).slider({
range: "max",
min: 1,
max: 50,
value: 25,
slide: function( event,ui, string) {
$( "#amount" ).val( ui.value + "suffix" );
$( "#amt_id" ).val( ui.value );
}
});
$( "#amount" ).val( $( "#slider-range-max" ).slider( "value" ) );
});
But this doesn't seem to work the way I would like it to and just tries to calculate with the string.
In you situation, you need to define your value type in:
$( "#amount" ).val( ui.value + "suffix" );
and in:
$( "#amount" ).val( $( "#slider-range-max" ).slider( "value" ) );
javascript does not know which type of data you enter. You should define such as respectively:
$( "#amount" ).val( "" + ui.value + "suffix" );
and
$( "#amount" ).val("" + $( "#slider-range-max" ).slider( "value" ) + "suffix" );
See, you add some quotation mark in where your value is you simply edit your variable as a string value.
Cheers!
And here is JSFiddle example
I know there is a min value in jquery's slider. However, is there a way I can make the slider handle stop moving under some value? Is there any variable I can change to make this happen?
Note: My Slider is vertical
Basically, if the minimum is 20, I don't want the slider handle going under 20.
Well you can check it in slide functionality as below:
DEMO HERE
$(function() {
$( "#slider-range" ).slider({
orientation: "vertical",
range: false,
value:20,
slide: function( event, ui ) {
if (ui.value < 20) // corrected
return false;
else
$( "#amount" ).val( ui.value );
}
});
$( "#amount" ).val( $( "#slider-range" ).slider( "value" ) );
});
Currently, I am using the jQuery slider with range. What I want to do is, upon the user submitting the form, I want the two values (max and min) to also be sent over to the controller, so I can save them in the database. They are both currently saved in the variable values:
$(function() {
$( "#slider-range" ).slider({
range: true,
min: 0,
max: 1000000,
step: 10000,
values: [100000 , 300000 ],
slide: function( event, ui ) {
$( "#amount" ).val( "£" + ui.values[ 0 ] + " - £" + ui.values[ 1 ] );
},
stop: function(event, ui) {
var values = $( "#slider-range" ).slider( "values" );
}
});
$( "#amount" ).val( "£" + $( "#slider-range" ).slider( "values", 0 ) +
" - £" + $( "#slider-range" ).slider( "values", 1 ) );
});
I have alerted the variable and it echos the correct two variables. I am at a complete loss as to how to get the two variables, possibly split, over to my Laravel controller, once the user submits the form.
I usually get the form's variables through the Input::get method:
$id = Input::get('id');
But trying to access this variable always returns NULL
Any help would be hugely appreciated.
Here is a jsfiddle of how to get it working properly. My guess is that you forgot to set the "name" attribute on the HTML input field.
I have 1 div and 1 text input field, the div is visible and the input is hidden. The input one gets its value from a range slider, I want to use jQuery somehow to take the value from this input area and populate the div on the fly, I've tried the following with no luck, can anybody see where i may be going wrong?
$( ".value-slider" ).val( $( "#val-slider" ).slider( "value" ) );
$( ".price" ).html( $( ".value-slider" ).html() );
Assuming I've understood you correctly, .value-slider is an input element, and .price is a div element. If that's right, then you need to get the value of the input, rather than the HTML:
$( ".price" ).html( $( ".value-slider" ).val() );
However, since you've just set the value of .value-slider, why not just store the value of the slider and use that?
var sliderValue = $( "#val-slider" ).slider( "value" );
$(".value-slider" ).val(sliderValue);
$( ".price" ).html(sliderValue);
To update the div whenever the input changes, do this
$(".value-slider" ).change(function() {
var sliderValue = $( "#val-slider" ).slider( "value" );
$(".value-slider" ).val(sliderValue);
$( ".price" ).html(sliderValue);
});
I've had some luck controlling processing.js sketches using html form elements and would like to use a jQuery slider to do the same.
<script>
$(function() {
$( "#slider-range-min" ).slider({
range: "min",
value: 37,
min: 1,
max: 700,
slide: function( event, ui ) {
$( "#amount" ).val( "$" + ui.value );
}
});
$( "#amount" ).val( "$" + $( "#slider-range-min" ).slider( "value" ) );
});
</script>
<p>
<label for="amount">Maximum price:</label>
<input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;"/>
</p>
<div id="slider-range-min"></div>
I think my main problem is that I don't entirely understand the slider function, how to refer to its value inside the sketch, or how to refer the window.processing.Data={}; variable inside the slider.
Any and all help is appreciated.
Here's a working demo if it helps:
http://matrix.senecac.on.ca/~asalga/FSOSS2010/jQueryUI/jquery-test.html
I've never used Jquery-ui's slider before so I'm not sure if your using it correctly. But you can easily communicate between the processing code and the javascript code by placing a variable on the window object:
1) window.communicate = {}
2) store variables on that object : window.communicate.myVar
3) alter the variables in javascript:
// inside jquery-ui callback
window.communicate.myVar = ui.value;
4) read the variables in processing
I created a a demo for you on jsfiddle: http://jsfiddle.net/Zevan/Rms2N/2/
UPDATE
So in your slide function you can set a variable on your communicate object:
slide: function( event, ui ) {
$( "#amount" ).val( "$" + ui.value );
window.communicate.value = ui.value;
}
Then you can use "window.communicate.value" anywhere in your processing.js code.