I just added a slider next to an input and added an input box after the slider. The problem is they are underneath my first input. I want them all side by side in the TD tag. Please help. Let me know if you need more code:
<td>$
<input name="sup" style="text-align: left;" maxlength="13"
value="${form.sup}"
onkeypress="javascript:return noenter();" />
<div id="calcSlider"></div>
<input type="text" id="calcRepairCostFactor" name="calcRepairCostFactor" value="10" size="3" readonly="readonly"/>
</td>
jquery:
$(function () {
$("#calcSlider").slider({ min: 0,
max: 90,
step: 5,
value: 10,
slide: function (event, ui) {
$("#calcRepairCostFactor").val(ui.value);
}
});
});
ANSWER:
<td>$
<input name="sup" style="text-align: left;" maxlength="13"
value="${form.sup}"
onkeypress="javascript:return noenter();" />
<div id="calcSlider" style='display: inline-block; width: 100px; height: 12px;'></div>
+/-
<input type="text" id="calcRepairCostFactor" name="calcRepairCostFactor" value="10" size="3" readonly="readonly"/>
%
</td>