Discovering the country associated with a country code using ngx-intl-tel-input

In my application, I am trying to implement a phone number field using this StackBlitz link. However, I have observed that it is not possible to search for a country by typing the country code (e.g., +231) in the country search dropdown. When I type a country name, it works fine, but using the code does not function.

Could someone help me either prevent users from entering numbers or enable searching by country code as well?

Searching by country name:

https://i.stack.imgur.com/lpJpJ.png

Searching by country code yields no result:

https://i.stack.imgur.com/alBrS.png

Answer №1

Absolutely! Take a glance at the different options you can input: https://github.com/webcat12345/ngx-intl-tel-input#options

Check out the enum SearchCountryField - it includes the option for DialCode.

By adding this to your searchCountryField array, you will be able to search by dial code.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Transforming an unordered list to function similarly to a select input

I am looking to style a ul list to function as a select form element. I have successfully populated a hidden input using my code. Now, I am trying to make the ul behave like a select input when either the keyboard or mouse is used. Previously, I had some ...

Is there a way to insert copied links onto separate lines?

I have a list of links to Google search results. I have a checker that allows me to mark the links and copy them. My code is functioning properly, but I want each link to appear on a new line. ... Can someone please help me? I've attempted to add "< ...

Tips for retrieving data from a JSON array

I have a JSON object that looks like this: var obj={ "address":{ "addlin1":"", "addlin2":"" }, "name":"sam", "score":[{"maths":"ten", "science":"two", "pass":false }] } Now, when I attempt to m ...

Exploring Ionic 4 with Angular Router

Presently, I am working on developing an application using the latest beta version 4 of Ionic and implementing the tabs layout. I am still trying to grasp how the navigation works with the new Angular router. This is my app-routing.module.ts: import { N ...

Display only the static placeholder in Angular 2 multi-select feature

My experience with angular 4 is fairly new and I've recently delved into using the angular multiselect feature with the npm package available here. I've managed to successfully configure it, as well as capture selected and deselected items/event ...

Sending form data from React to Express involves creating a form in the React component,

Hello, I am new to React and trying to figure out how to send registration data from a form submission to my backend. I have attempted the traditional method of setting up the post method and route in the form, but it doesn't seem to be working for me ...

Locate the positions of 2 identification numbers within a Mongoose array

I am currently working on developing a middleware that validates if a conversation exists between two users in the database. If the conversation does not exist, the middleware will create a new conversation. I am attempting to utilize Mongoose's $in o ...

Creating a visually stunning image grid akin to the meticulously designed layouts found

Forgive my lack of knowledge, but I'm curious about how to create an image or text grid similar to Tumblr using HTML and CSS. I'm looking to achieve a layout like this: ...

Script tag for Next.js reloading functionality

I have been facing a challenge while trying to integrate third-party commenting scripts like (disqus, remark42, hyvor) into my next.js application. The issue I encountered is that the script only loads on the initial page load. Subsequently, I need to refr ...

Activate a spinner when a button is clicked within a row of an antd table

I created a table with a column that includes a button like the one below: const columns = [ ... { title: "button", dataIndex: "key", render: (text, record) => { return ( <Button icon={<Del ...

AngularJS: Share event from the parent component exclusively with its child components

I am looking to establish a way to broadcast an event from a parent directive to a specific child, without all children in every instance of the "parent" directive receiving it when using scope.broadcast in the parent directive link function. Current Beha ...

Is there a way to display a JS alert just one time?

How can I display a message to users on LT IE8 encouraging them to upgrade their browser for a better web experience? I only want the message to appear on their first visit, not every time they refresh the page. Is there a solution for this issue? Thank ...

HTML table row content should be aligned to the left side

I am attempting to align the data in the 'Address' column without any margin. I want it to start from the left since it's overflowing. You can find the HTML, CSS, and JS code here Even though I tried using <td align="left">..</td& ...

Ways to address the alignment of list items within a drawer component using React

A couple of days back, I posted a query right here: How can I expand only one ListItem using a single method in React? I received an incomplete response which I accepted (although it seemed to work initially). Admittedly, my question may have been slight ...

Monitor for the specific parameter in the incoming GET request

My application is using the POST method to submit jobs remotely. After submitting a job, I receive a unique job ID from the POST request that allows me to check the status of the job using a GET request. $http.get('http://localhost:8090/jobs/'+i ...

The source 'http://localhost:3000' is not authorized to access the Twitter API

I am working on a web application that utilizes the Twitter API REST. On one of my pages, I have a list of Twitter accounts and a button to add a new account. When this button is clicked, it triggers a function in the Angular controller: // Function to ...

Sharing variables between different routes in ExpressJS

Currently, I am utilizing ExpressJs with Node.js and have organized all my routes in a 'routes' folder. When setting up the server, my process involves establishing a DB connection followed by defining the routes as shown below: var routes = re ...

Utilizing AXIOS in React functional components for REST API integration

When trying to parse Rest API responses with JSON using AXIOS in a functional component, the issue arises where it initially returns an empty array before displaying the exact API response data after rendering. This can be confusing as the return function ...

How to highlight text within an iframe using the mouse and displaying the selected text in a separate div

I'm currently able to select text with the mouse and display that selection in a div. However, I'm struggling to do the same thing when dealing with an iframe displaying a page on the same domain. Despite trying various solutions found here, I h ...

Mocking callback or nested function with jest

My code snippet looks like this: public async waitForElementSelected(element: WebdriverIO.Element) { /** * Maximum number of milliseconds to wait for * @type {Int} */ const ms = 10000; await browser.waitUntil(async () =>{ ...