How to write InputNumber control

How to write InputNumber control

Posted by: thanhthuyeths on 29 January 2024, 5:13 am EST

• 

  thanhthuyeths

  • Post Options:
  • Link
    Copy

  Posted 29 January 2024, 5:13 am EST

  Hello,

  I am using the InputNumber control with two ways of writing as below:

  Style 1: <c1-input-number id="I_Meibo_Nendo" name="I_Meibo_Nendo" for="I_Meibo_Nendo" min="0" max="9999" width="100%" is-required="false"></c1-input-number>
  Style 2: @Html.C1().InputNumber().Id("I_Meibo_Nendo1").Value(Model?.I_Meibo_Nendo).Min(-9999).Max(9999).Name("I_Meibo_Nendo").Format("g")

  In style 1, the output to html is

  <input type="text">

  
  
  In style 2, the output to html is

  <input type="tel">

  1. In style 1, I want to output

     <input type="tel">

     what should I do?
  2. Is there any documentation about the difference between these two styles?

  please help me!

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 30 January 2024, 12:36 am EST

  Hello,
  
  Please refer to the following documentation for read more about the InputType tel.
  
  https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/tel

  Please also copy the following code and add this to your application just after where the C1-scripts are referenced.

  
  < script>
      var oldAfterInitFunc = c1.mvc.input._FormInputInitializer.prototype._afterInitializeControl;
      c1.mvc.input._FormInputInitializer.prototype._afterInitializeControl = function (options) {
          oldAfterInitFunc.call(this, options);
          this.control.inputElement.type = 'tel';
      }
  </script>

  The above code will set the input type as tel for all C1-Input-Number instance for your application.

  Regards,
  
  Manish Gupta