jquery - submit of a bunch of slider values

Question

So I have 5 sliders on a web page. Any brilliant solutions as to how to grab their values and submit them to the server (rails in this case) (ajax is ok)?

One solution is to use hidden fields and on each slider change to update the corresponding hidden field. Seems kinda lame.

The sliders all have a class of "slider", so I was hoping for some cool approach like

var json = $(".slider").toJSON();
$.ajax({
   url: "myurl",
   processData: false,
   data: json,
   success: handleResponse
 }

which would take all the values and put them in a JSON structure. However, that doesn't work :(

Other ideas?

Answer 1

Have a hidden input for each slider. Then when the slider value is changed, update the corresponding hidden value. Then when the form is submitted, those values will get passed along to the action.

$("#slider-x").bind("slidechange", function(event, ui) {
    $("#slider-hidden-x").attr('value', $("#slider-x").slider( "option", "value" ));
});

Then for each slider:

<input type="hidden" name="slider-hidden-x" value="0" />

Answer 2

why doesn't the json work? we use something similar to this all the time:

$.ajax({
   url: '/Home/Save',
   type: 'POST',
   data: myData,
   dataType: 'json',
   contentType: "application/json; charset=utf-8",
   success: function(result) {
       //dosomething
   }
});