Hi, I added a slider to form-element using field-suffix including jQuery.
<code> ... 'outlinewdidth' => array( '#type' => 'textfield', '#title' => t('Outline width'), '#field_suffix' => " <div style='width: 256px;' id='edit-outlinewidth_slider'></div> <script type='text/javascript'>jQuery(document).ready(function(){jQuery('#edit-outlinewidth_slider').slider({range:'min',value: jQuery('#edit-outlinewidth').val(),min:0,max:5,step:0.01,slide:function(event, ui ){jQuery('#edit-outlinewidth').val(ui.value);}});});</script>" ... </code>
The part of the form is changed by an ajax-event. The slider is not available after this. The jQuery script is returned by the callback function but doesn't seem to be executed after the form part is changed by ajax.
I thought it's because of the jQuery(document).ready(function(){} but even putting my jQuery it into the <div> using
<div style='width: 256px;' id='edit-outlinewidth_slider' onload="jQuery('#edit-outlinewidth_slider').slider({range:'min',value: jQuery('#edit-outlinewidth').val(),min:0,max:5,step:0.01,slide:function(event, ui ){jQuery('#edit-outlinewidth').val(ui.value);}});"></div>
doesn't work.
How to manage this task?
Marco