Click here to Skip to main content
15,881,380 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
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>

    )
  }


What I have tried:

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
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900