<input> tag for editableTooltip accepts any text

[sertal70]

Hi, first of all thanks for this wonderful plugin, it is really amazing.

In my app I need to allow the user to type a value in the tooltip, so I set editableTooltip: true in options. Unfortunately, this renders an <input> html without the text="number" attribute, letting the user to input any character instead of numbers only.

Moreover, on a mobile phone this cause the wrong keyboard to be shown, as you can see in th screenshot below.

Is there any way to fix this?

[soundar24]

@sertal70 as temporary fix you can add the below code in your application to overwrite the behaviour. It simply adds the required attribute when we create the tooltip textbox.

var fn1 = $.fn.roundSlider.prototype.$createElement;
$.fn.roundSlider.prototype.$createElement = function (tagName) {
  var $ele = fn1.call(this, tagName);
  if ($ele.hasClass('rs-input rs-tooltip-text')) {
  	$ele.attr({ "type": "text", "inputmode": "numeric" });
  }
  return $ele;
}

Here is the working demo: https://jsfiddle.net/soundar24/cwe71a3h/

To confirm this behaviour you can directly open the below link in your mobile and confirm: https://jsfiddle.net/soundar24/cwe71a3h/show

[sertal70]

@soundar24 the fix works smoothly, thanks so much!