Bootstrap Snippet Input element with display format string using HTML Bootstrap Javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
 <div class="row" style="padding-left:3px">
         <label id="agSabitDSLabel" class="col-12 col-lg-12 col-form-label fontlabel agSargiBilgileriInputLabel"> Height</label>
          <div class="col-3 col-lg-3">
               <input id="agSabitDS" name="agSabitDS" type="number" max="999" min="0" required="" placeholder="" class="form-control form-control-sm fontinput agSargiBilgileriInput" value="12" onfocus="hiddenInputText(this.id)" onblur="showInputText(this.id)" onchange="valControl(this.id)">
                <label id="wagSabitDS" style="position:absolute;top:12px;left:75px;font-size:10px;">mm</label>
                 </div>
</div>
<div style="margin-left:550px">
      <br>
      <span>Got a problem? Send me a mail</span>
      <br>
       <span style="text-align:center;">utkuudemr@gmail.com</span>
  </div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
function hiddenInputText(id) {
        debugger;
        var val = document.getElementById("w" + id).value;
        document.getElementById("w"+id).style.display = 'none';
}
function showInputText(id) {
        debugger;
        var val = document.getElementById(id).value;
        if (val == "" || val == undefined) {
            document.getElementById("w" + id).style.display = 'none';
        }
        else {
            document.getElementById("w" + id).style.display = 'block';
        }
       
    }
    
    function valControl(id)
    {
        var s=document.getElementById(id).value;
        if(s>999)
        {
            document.getElementById(id).value=999;
        }
        if(s<0)
        {
            document.getElementById(id).value=0;
        }
    }
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Input element with display format string"
Bootstrap 4.1.1 Snippet by utkudemir

Related: See More

Questions / Comments:

"Input element with display format string" Bootstrap 4.1.1 Snippet by utkudemir

Related: See More

Questions / Comments:

"Input element with display format string"
Bootstrap 4.1.1 Snippet by utkudemir