How do I display a tooltip if a digit is entered in my textinput component- ReactJS es5?


#1

My textinput component is given below:

 const React = require('react')
   module.exports = (props) =>
   {

  return (
    <div>

    <input
      id={props.id}
      type="text"
      title={props.placeholder}
      onBlur={e => props.onBlur(props.fieldName, e.target.value)}
      style={props.style}
      tabIndex={props.tabIndex}
      onKeyPress={(e) => fourthMethod(e, props.id,props.pattern)}
    />

    </div>
  )
}



function fourthMethod(e,id,pattern) {
  if (id == "#01013") {
    console.log(id);
    const re = new RegExp(pattern);
   // const re = /[a-fA-F]+/g;
    if (!re.test(e.key)) {
      e.preventDefault();
    }
  }

  }

My index.js where I am rendering text input component is given below:

const TextInputComponent = require('../../components/TextInput')
const TextInput = ({ fieldName, placeholder, style, id, tabIndex, pattern }) => {

    return (

        <TextInputComponent pattern={pattern} id={id} tabIndex={tabIndex} onBlur={fieldChanged} fieldName={fieldName}
         placeholder={placeholder} style={style} ></TextInputComponent>

    )
  }

Now I need for this text input component which will show if I enter a digit to the text field. How can I achieve it ?


#2

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.