CODEWITHSUNDEEP
javascript
user613507
user613507

Reputation: 41

Disable up and down arrow

I have this data field for input

image

And it does show a data selector plugin which works fine with the keyboard.

But I want to disable the up and down arrows. Could you guide me how?

Also need when date filed is clicked that it open date picker or when the user clicks on calendar icon Thanks.

Code:

<div class="col-sm-10">
                                <input type="date"ng-model="date" class="form-control"  placeholder="date" style="width:180px" id="date" ng-required="true">
                                <span class="input-group-addon" style="width:auto">
                                    <span class="glyphicon-calendar glyphicon"></span>
                                </span>
                            </div>
<div class="col-sm-10">
                            <input type="date"ng-model="client.dateofbirth" class="form-control"  placeholder="Data de nascimento" style="width:180px" id="dateofbirth" ng-required="true">
                            <span class="input-group-addon" style="width:auto">
                                <span class="glyphicon-calendar glyphicon"></span>
                            </span>
                        </div>

the calendar icon also shows me down not in the correct place... I want when I click on the textbox it opens the calendar.

<script type="text/javascript">
    // not working  

    $('#date').datepicker(
        {
            allowInputToggle: true

        });

Upvotes: 0

Views: 2849

Answers (1)

Adam Azad
Adam Azad

Reputation: 11297

From the look of it, it looks like the input has type="number", but I am not sure why there is a dropdown arrow there. You can remove the up and down arrows using CSS. I always add this snippet in my main CSS/SASS file. 

input[type="number"]::-webkit-inner-spin-button, 
input[type="number"]::-webkit-outer-spin-button { 
    -webkit-appearance: none; 
    margin: 0; 
}
input[type="number"] { 
    -moz-appearance: test-field; 
}
<input type="number"/>

Source: Turn Off Number Input Spinners | CSS-Tricks

Upvotes: 1

Related Questions