Need help in SPFx -React Solution.

Copper Contributor

Hello Experts ,

I am new in learning of SPFx react. I have following scenario:

when a label value is equal to Text Field value, a button should be disabled else should be enabled.


I have written below code. but It is running when I clicked on button. But I want when Text Field value is equal to Label value the button should be disabled on runtime.


Please help/correct my code. Thanks in advance.


and the code is:




4 Replies


you can call the function handleclick on text Field.
onChanged = {this.handleclick }
and then in function u just setstate of User text before line no 24. I think that should work. Done forget to remove onClick on button.

I have checked with that one but it didn't work. When I was typing something in textfield all page goes blank.
best response confirmed by kiyaan0712 (Copper Contributor)


Hey Replace your code with below code

import * as React from 'react';
import { TextField, MaskedTextField } from 'office-ui-fabric-react/lib/TextField';
import { Label } from 'office-ui-fabric-react/lib/Label';
import { DefaultButton, PrimaryButton } from 'office-ui-fabric-react'; 

export interface ICustomComponentProps {
  description: string;
export interface ICustomComponentState {  
  userText: string;
  disabled?: boolean;
  checked?: boolean;
export default class MyFirstCompo extends React.Component<ICustomComponentProps, ICustomComponentState> {
constructor(props: ICustomComponentProps, state: ICustomComponentState){
  this.state = {
  userText: "",
  disabled: false
public handleClick(e) {
        userText : e

public render(): React.ReactElement<ICustomComponentProps> {
    return (
        <h3>Custom Component!!!</h3>
        <TextField value={this.state.userText} onChanged={this.handleClick} label="Type String Below:" ></TextField><br></br>
        <PrimaryButton text="Button" disabled={ this.props.description == this.state.userText? true:false}/>

 Please let me know your response



Thanks for the help. The code is given by you, is working like charm. You saved my days.