How can i handle confirm dialog in webview? UWP windows 10 app C#

Question

i am developing uwp app (win 10) by c#

i want put my website in xaml webview element.

most of function are workable.

but i can't handle the confirm dialog

for example

this is sample html & js code

<button id="btnConfirm" onclick="confirmBox('sure to delete?')">click me to confirm</button>
<button id="btnAlert" onclick="alert('alert message')">click me to alert</button>
<script type="text/javascript">
    function confirmBox(message) {
        if (confirm(message)) {
         alert("yes");
      } else {
         alert("no");
      }
    }
</script>

this is my xaml code

<WebView Grid.Row="1" x:Name="webView1" Source="ms-appx-web:///HTMLPage1.html" Width="auto" Height="auto"/>

this is my C# code

webView1.ScriptNotify += webView1_ScriptNotify;
webView1.NavigationCompleted += webView1_NavigationCompleted;


async void webView1_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
{
      await webView1.InvokeScriptAsync("eval", new string[] { "window.confirm = function(confirmMessage) { window.external.notify('typeConfirm:' + confirmMessage) }" });
      await webView1.InvokeScriptAsync("eval", new string[] { "window.alert = function(AlertMessage) { window.external.notify('typeAlert:' + AlertMessage) }" });
}

 private async void webView1_ScriptNotify(object sender, NotifyEventArgs e)
 {
            Windows.UI.Popups.MessageDialog dialog;
            string[] messageArray = e.Value.Split(':');
            string message;
            string type;

            if (messageArray.Length > 1)
            {
                message = messageArray[1];
                type = messageArray[0];
            }
            else
            {
                message = e.Value;
                type = "typeAlert";
            }
            dialog = new Windows.UI.Popups.MessageDialog(message);
            Debug.WriteLine("type=" + type + " ,message=" + message);

            if (type.Equals("typeConfirm"))
            {
                dialog.Commands.Add(new UICommand(
                    "Yes",
                    new UICommandInvokedHandler(this.CommandInvokedHandler)));
                dialog.Commands.Add(new UICommand(
                    "Cancel",
                    new UICommandInvokedHandler(this.CommandInvokedHandler)));

                dialog.DefaultCommandIndex = 0;

                dialog.CancelCommandIndex = 1;
            }
            var result = await dialog.ShowAsync();
            if (result.Label.Equals("Yes"))
            {
               // return true; 
            }
            else
            {
              // return false
            }
 }

the problem is that confirm js function will always return false

before user clicked the yes or no.

i can get user choosed button. but it's too late.

js function "confirm" will never return true in this situation.

anyone can help me?

thanks.

Answer 1

This will not work. JS runs on single thread, and will not wait for the result of the c# call. So the alert will not wait for the result from the MessageDialog.

Please note that webview in winrt project more suitable for displaying some static html. If you do want to pop up a MessageDialog act as a confirm dialog, then you need to complete all rest work that you previous do in javascript in your c# code.

For example, if you want to change some text of a html control, you need to prepare a complete html string, then check command status in CommandInvokedHandler callback and let webview navigate to(webView.NavigateToString) the new html string.

Answer 2

If you need to receive notifications and data in your app code sent from WebView-hosted script, you need to handle the ScriptNotify event. You can refer to this sample (The scenario6).