Hi i have a form in my website which take users country prefix phone number according thier ip but the problem is the input is editable and i want they just select their country and cant change or edit this input at all here is html code :

                                      <input class="form-text telefon" autocomplete="off" data-rule-required="true" name="phone" id="phone" required type="tel" data-intl-tel-input-id="0" required aria-required="true" > 
                                     <input class="form-text clear-input row" type="text" id="phonen" data-rule-required="true" data-msg-required="Enter Phone Number" name="leadPhone" placeholder="Telefon Numaranız *" required aria-required="true"> 

the first input work as a part which find prefix number and second one is the part user can enter their phone number ,

i tried readonly for first input but it prevent to user choose thier country prefix from the menu you can see the form here , its in the last step of the get free hair analys part ,