How to force field type to range in Grocery Crud?

Question

I need a range input to get an integer between 100 and 500 in Grocery Crud. Currently it's a normal text input field, and field_type() method doesn't have the range option. Is there a solution to add Bootstrap range instead?

Answer 1

For a simple way, you can use type number at input form

<input type="number" name="grocery" id="grocery" min="100" max="500" />

Another way you can use javascript

<script>
  function integerInRange(value, min, max) {

      if(value < min || value > max)
        {
            document.getElementById("grocery").value = "500";
            alert("min = 100 and max = 500");
        }
      }
</script>

and in your view

<input type="text" class="form-control"  name="grocery" id="grocery" onkeyup="integerInRange(this.value, 100, 500)" />