ui slider - problem

ui slider - problem


Hi everybody,
I'm new to jquery UI and sliders.
I'm using multiple sliders in my company's web-site. I try to describe how
pages work and what is my problem.
There are two pages: "user_hp.php" and "update_preferences.php".
In "user_hp" there are 5 vertical sliders. Users could slide or not and
update their profile.
Clicking on "update profile", users send slider's values to the
"update_preferences.php" page, that write it on DB.
After that, "update_preferences.php" make a redirect to "user_hp.php".
Below the description of my problem:
- if users slide and update the profile, everything work (after the
redirect, "user_hp.php" shows slider values correctly)!!!
- if users doesn't slide but only update their profile, after the redirect
slider's value go down to the min value.
Below the HTML in the page "user_hp.php":
****************************************************************************
<div class="preferenze">
<div id="display_pref">
<?=$user_socialita?>
<?=$user_natura?>
<?=$user_avventura?>
<?=$user_sport?>
<?=$user_arte?>
<div class="clearBoth"></div>
</div>
<div class="clearBoth"></div>
<div id="pref">
<?=$user_socialita?>
<?=$user_natura?>
<?=$user_avventura?>
<?=$user_sport?>
<?=$user_arte?>
</div>
<div class="clearBoth"></div>
<div id="display_val" style="display:none;">
<div id="val_socialita"></div>
<div id="val_natura"></div>
<div id="val_avventura"></div>
<div id="val_sport"></div>
<div id="val_arte"></div>
</div>
</div>
****************************************************************************
The php variables "$user_socialita", "$user_natura", ecc ecc, are the
values wrote on DB.
Below the JavaScript code that implements sliders:
****************************************************************************
$(function() {
// change defaults for range, animate and orientation
$.extend($.ui.slider.defaults, {
range: "min",
animate: true,
orientation: "vertical",
min: 0,
max: 5
});
// setup vertical slider
$("#pref > span").each(function() {
// read initial values from markup and remove that
var value = parseInt($(this).text());
$(this).empty();
$(this).slider({
value: value
})
});
$('#pref > span#socialita').bind('slidestop', function(event, ui) {
$('#display_val > #val_socialita').html('<input name="socialita"
readonly="readonly" type="text" value="'+$('#pref > span#socialita').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_natura').html('<input name="natura"
readonly="readonly" type="text" value="'+$('#pref > span#natura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_avventura').html('<input name="avventura"
readonly="readonly" type="text" value="'+$('#pref > span#avventura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_sport').html('<input name="sport"
readonly="readonly" type="text" value="'+$('#pref > span#sport').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_arte').html('<input name="arte"
readonly="readonly" type="text" value="'+$('#pref > span#arte').slider(
'value')+'" style="display:none;"/>')
$('#display_pref > #pref_socialita').html($('#pref >
span#socialita').slider( 'value'))
$('#display_pref > #pref_natura').html($('#pref >
span#natura').slider( 'value'))
$('#display_pref > #pref_avventura').html($('#pref >
span#avventura').slider( 'value'))
$('#display_pref > #pref_sport').html($('#pref > span#sport').slider(
'value'))
$('#display_pref > #pref_arte').html($('#pref > span#arte').slider(
'value'))
});
$('#pref > span#socialita').bind('slide', function(event, ui) {
$('#display_pref > #pref_socialita').html($('#pref >
span#socialita').slider( 'value'))
});
$('#pref > span#natura ').bind('slidestop', function(event, ui) {
$('#display_val > #val_socialita').html('<input name="socialita"
readonly="readonly" type="text" value="'+$('#pref > span#socialita').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_natura').html('<input name="natura"
readonly="readonly" type="text" value="'+$('#pref > span#natura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_avventura').html('<input name="avventura"
readonly="readonly" type="text" value="'+$('#pref > span#avventura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_sport').html('<input name="sport"
readonly="readonly" type="text" value="'+$('#pref > span#sport').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_arte').html('<input name="arte"
readonly="readonly" type="text" value="'+$('#pref > span#arte').slider(
'value')+'" style="display:none;"/>')
$('#display_pref > #pref_socialita').html($('#pref >
span#socialita').slider( 'value'))
$('#display_pref > #pref_natura').html($('#pref > span#natura').slider(
'value'))
$('#display_pref > #pref_avventura').html($('#pref >
span#avventura').slider( 'value'))
$('#display_pref > #pref_sport').html($('#pref > span#sport').slider(
'value'))
$('#display_pref > #pref_arte').html($('#pref > span#arte').slider(
'value'))
});
$('#pref > span#natura').bind('slide', function(event, ui) {
$('#display_pref > #pref_natura').html($('#pref > span#natura').slider(
'value'))
});
$('#pref > span#avventura').bind('slidestop', function(event, ui) {
$('#display_val > #val_socialita').html('<input name="socialita"
readonly="readonly" type="text" value="'+$('#pref > span#socialita').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_natura').html('<input name="natura"
readonly="readonly" type="text" value="'+$('#pref > span#natura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_avventura').html('<input name="avventura"
readonly="readonly" type="text" value="'+$('#pref > span#avventura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_sport').html('<input name="sport"
readonly="readonly" type="text" value="'+$('#pref > span#sport').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_arte').html('<input name="arte"
readonly="readonly" type="text" value="'+$('#pref > span#arte').slider(
'value')+'" style="display:none;"/>')
$('#display_pref > #pref_socialita').html($('#pref >
span#socialita').slider( 'value'))
$('#display_pref > #pref_natura').html($('#pref > span#natura').slider(
'value'))
$('#display_pref > #pref_avventura').html($('#pref >
span#avventura').slider( 'value'))
$('#display_pref > #pref_sport').html($('#pref > span#sport').slider(
'value'))
$('#display_pref > #pref_arte').html($('#pref > span#arte').slider(
'value'))
});
$('#pref > span#avventura').bind('slide', function(event, ui) {
$('#display_pref > #pref_avventura').html($('#pref >
span#avventura').slider( 'value'))
});
$('#pref > span#sport').bind('slidestop', function(event, ui) {
$('#display_val > #val_socialita').html('<input name="socialita"
readonly="readonly" type="text" value="'+$('#pref > span#socialita').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_natura').html('<input name="natura"
readonly="readonly" type="text" value="'+$('#pref > span#natura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_avventura').html('<input name="avventura"
readonly="readonly" type="text" value="'+$('#pref > span#avventura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_sport').html('<input name="sport"
readonly="readonly" type="text" value="'+$('#pref > span#sport').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_arte').html('<input name="arte"
readonly="readonly" type="text" value="'+$('#pref > span#arte').slider(
'value')+'" style="display:none;"/>')
$('#display_pref > #pref_socialita').html($('#pref >
span#socialita').slider( 'value'))
$('#display_pref > #pref_natura').html($('#pref > span#natura').slider(
'value'))
$('#display_pref > #pref_avventura').html($('#pref >
span#avventura').slider( 'value'))
$('#display_pref > #pref_sport').html($('#pref > span#sport').slider(
'value'))
$('#display_pref > #pref_arte').html($('#pref > span#arte').slider(
'value'))
});
$('#pref > span#sport').bind('slide', function(event, ui) {
$('#display_pref > #pref_sport').html($('#pref > span#sport').slider(
'value'))
});
$('#pref > span#arte').bind('slidestop', function(event, ui) {
$('#display_val > #val_socialita').html('<input name="socialita"
readonly="readonly" type="text" value="'+$('#pref > span#socialita').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_natura').html('<input name="natura"
readonly="readonly" type="text" value="'+$('#pref > span#natura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_avventura').html('<input name="avventura"
readonly="readonly" type="text" value="'+$('#pref > span#avventura').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_sport').html('<input name="sport"
readonly="readonly" type="text" value="'+$('#pref > span#sport').slider(
'value')+'" style="display:none;"/>')
$('#display_val > #val_arte').html('<input name="arte"
readonly="readonly" type="text" value="'+$('#pref > span#arte').slider(
'value')+'" style="display:none;"/>')
$('#display_pref > #pref_socialita').html($('#pref >
span#socialita').slider( 'value'))
$('#display_pref > #pref_natura').html($('#pref > span#natura').slider(
'value'))
$('#display_pref > #pref_avventura').html($('#pref >
span#avventura').slider( 'value'))
$('#display_pref > #pref_sport').html($('#pref > span#sport').slider(
'value'))
$('#display_pref > #pref_arte').html($('#pref > span#arte').slider(
'value'))
});
$('#pref > span#arte').bind('slide', function(event, ui) {
$('#display_pref > #pref_arte').html($('#pref > span#arte').slider(
'value'))
});
})
****************************************************************************
I'm not very practice with JavaScript, so maybe there is a better way to do
that without bugs.
Anyone can help me?
Thanks
Pasquale
--
View this message in context: http://www.nabble.com/ui-slider---problem-tp23710325s27240p23710325.html
Sent from the jQuery UI Discussion mailing list archive at Nabble.com.