CODEWITHSUNDEEP
javascriptreactjs
Kristina Bressler
Kristina Bressler

Reputation: 1732

React I couldn't get the Price Popup window to close

I am building the React application and I am unable to close the Price Popup window. I tried everything all day yesterday but couldn't solve this problem. Can anyone help me find the error, please?

What I am attempting to do is when you click on the Price button in each Security list, the Popup window open up with Price list. You can enter a new price to the list. Then when you click on Close button, the window close and the security list with price list in each security is updated.

You can check out my React application at https://codesandbox.io/s/github/kikidesignnet/caissa.

Upvotes: 0

Views: 65

Answers (1)

awran5
awran5

Reputation: 4536

Based on your code logic, your price button is suppose to open another component <PriceForm> but you didn't pass any toggle method to close it, so you just to need to pass the togglePricePopup as a prop (I called it onClose) then call it inside your handleFormSubmit:

SingleSecuritybox/index.js

{this.state.showPricePopup ? (
  <PriceForm
    pricelist={this.props.price}
    editCurrentPrice={this.editCurrentPrice}
    onClose={this.togglePricePopup} // new prop
  />
) : null}

PriceForm/index.js

handleFormSubmit = e => {
  // prevents page refreshes on submission
  e.preventDefault();

  // code...

  // passed prop from SingleSecuritybox
  this.props.onClose();
};

codeSandbox

Upvotes: 2

Related Questions