send data of Form to function & needs receive function in Injected Javascript of webview React native.Only getting response in IOS, not in android

Viewed 14

Here code of HTML and React native to send and Receive data Please checkout and give some solution if anyone have ...appreciate their support

// Below is HTML Code..

    $('#submitBtn').on('click', function (e) {
        try {
           ;

            // check if form is valid
            if (!$('#Form').valid()) {
                return;
            }

            if (typeof invokeFormsAction == 'function') {
                var param = $("#username").val() + "~" + $('#pwd').val();
                invokeFormsAction('REMEMBER_SET|' + param);
            }
            // always submit form
            $('#loginForm').submit();

        } catch (err) {
            console.log("standalone");
        }
    });




// React native Code

export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      webview: "",
      canGoBack: null,
      ref: null,
    }

  }
  onMessage = (message) => {
    console.log('action result coming from the webview:==> ', message.nativeEvent);
    
  };

  onNavigationStateChange(navState) {
    this.setState({
      canGoBack: navState.canGoBack
    });
  }
  onBack() {
    console.log("GoBack");
    this.state.webview.goBack();
  }
  onLoadEnd() {
    this.state.webview.postMessage("RN message");
  }

  render() {
   
   

    var INJECTED_JAVASCRIPT = `function invokeFormsAction(data){window.ReactNativeWebView.postMessage(data)}`;


    

    return (
      <SafeAreaView style={{ flex: 1 }}>
        <View>
          <TouchableOpacity
            style={{ margin: 15 }}
            disabled={!this.state.canGoBack}
            onPress={this.onBack.bind(this)}
          >
            <Image source={require('../webtest/src/assets/images/back.png')} style={{ tintColor: "black", height: 20, width: 20, resizeMode: 'contain' }} />
            
          </TouchableOpacity>
        </View>

        <WebView
         
          ref={webView => {
            this.state.webview = webView;
          }}
          source={{
            uri: 'WEB URL',
          }}
          
          injectedJavaScript={INJECTED_JAVASCRIPT}
          onMessage={this.onMessage}
          onLoadEnd={() => this.onLoadEnd()}
          onNavigationStateChange={this.onNavigationStateChange.bind(this)}
          javaScriptEnabled={true}
        />
      </SafeAreaView>
    )
  }
}

I need to receive data of HTML form from webview to react native and Display in onMessage() method.if anyone have ref Thanks for Support....

0 Answers
Related