Zystkmt

I'm using react-native-popup-dialog. There is a single button within popup (yes). I want to close the button at same time I want to submit values to server.Now after clicking on yes button values get submit to server. How do I write close function at same onPress method? following is my code

onPressYes = (workType) => {

            AsyncStorage.getItem('userid').then((usid) =>{

          this.setState({

            'userid': usid

          });

          console.log(usid);

         fetch(GLOBAL.USER_REQUEST,{

           method:'POST',

           headers:{

             'Accept': 'application/json',

             'Content-Type': 'application/json',



           },

           body:  JSON.stringify({

            workType,

            usid

             })

         })

         .then(response => response.json())

         .then((responseData) => {

           this.setState({

           data:responseData

         });

         });

            })

     }



popUpDialog = (id, workType) => {

           this.setState ({

            workType: workType

         });

         this.popupDialog.show();



       }

render(){

  return(

      <PopupDialog ref={popupDialog => {

                           this.popupDialog = popupDialog;

                         }}

                        dialogStyle={{ backgroundColor: "#FFFFFF", height: 180, width:300, borderWidth:1,padding:10}}

                        overlayBackgroundColor="#fff"  onDismissed={() => {

  }}>

                          <View style={styles.dialogContentView}>

                            <Text style={{fontSize:18, margingTop:10,color:"#000000"}}>Are you sure you want to submit?</Text>

                            <View style={{alignSelf:'center'}}>



                              <View style={styles.button_1}>

                                <Button title="Yes" color="#8470ff" onPress={() => this.onPressYes(workType)}/>

                              </View>

);

According to your code, you can use this.popupDialog.dismiss() instance method to hide a dialog:

onPressYes = (workType) => {

    this.popupDialog.dismiss(); // action to close a dialog



    AsyncStorage.getItem('userid').then((usid) =>{

    this.setState({

      'userid': usid

    });

    console.log(usid);

    fetch(GLOBAL.USER_REQUEST,{

      method:'POST',

      headers:{

        'Accept': 'application/json',

        'Content-Type': 'application/json',



      },

      body:  JSON.stringify({

      workType,

      usid

        })

    })

    .then(response => response.json())

    .then((responseData) => {

      this.setState({

      data:responseData

    });

    });

      })

}

Using visible props to control it.

import Dialog, { DialogContent } from 'react-native-popup-dialog';

import { Button } from 'react-native'



<View style={styles.container}>

  <Button

    title="Show Dialog"

    onPress={() => {

      this.setState({ visible: true }); // here

    }}

  />

  <Dialog

    visible={this.state.visible} // here

    onTouchOutside={() => {

      this.setState({ visible: false });

    }}

  >

    <DialogContent>

      {...}

    </DialogContent>

  </Dialog>

</View>

Ref: https://github.com/jacklam718/react-native-popup-dialog