none
How to set some string coming from server into textarea of a html editor loaded in webview RRS feed

  • Question

  • I am trying to make make an html editor in windows store app 8.1 in which an html editor is loaded into webview and the content of textarea is to be set dynamically but I am not able to achieve this. I tried reading the html file and storing into string and then append required javascript code but then it stops loading the text editing controls and also the content is not navigated. Can anybody provide any help? Link to my demo is  

    https://onedrive.live.com/redir?resid=2D07E008BB4FBF8C!109&authkey=!AMnOtlr3s5Aw3tA&ithint=file%2czip

    Monday, November 3, 2014 12:57 PM

Answers

  • Hi RohitrkKUmar,

    >>I tried reading the html file and storing into string and then append required javascript code but then it stops loading the text editing controls and also the content is not navigated

    I've tested your project, I think the reason is the incorrect usage of WebView.InvokeScriptAsync method:

    webview_demo.InvokeScriptAsync(html_editor, null);

    Please refer to this page: http://msdn.microsoft.com/en-us/library/windows.ui.xaml.controls.webview.invokescriptasync.aspx

    The first parameter is the name of script, for example:

    <!DOCTYPE html>
    
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        <textarea id="textarea" placeholder="Enter text ..."></textarea>
    
        <script type="text/javascript">
        function insertText() {
            document.getElementById('textarea').focus();
            document.getElementById('textarea').innerHTML = "insertText";
        }
        </script>
    </body>
    
    </html>

    There is a script named "insertText" inside the above HTML, so we can invoke it like this:

    webview_demo.InvokeScriptAsync("insertText", null);

    For your advanced.html, we can manually add the following script:

    <script type="text/javascript">
        document.getElementById('textarea').focus();
        document.getElementById('textarea').innerHTML = "adhaskdhasodhihfvkjv";
    </script>

    The textarea will be filled when the page loads:

    But if you need to auto insert new data into textarea using InvokeScriptAsync() method, we found that there are some limitation in your HTML project, we can't change the content of textarea using script code.


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.


    Tuesday, November 4, 2014 9:02 AM
    Moderator

All replies

  • Hi RohitrkKUmar,

    >>I tried reading the html file and storing into string and then append required javascript code but then it stops loading the text editing controls and also the content is not navigated

    I've tested your project, I think the reason is the incorrect usage of WebView.InvokeScriptAsync method:

    webview_demo.InvokeScriptAsync(html_editor, null);

    Please refer to this page: http://msdn.microsoft.com/en-us/library/windows.ui.xaml.controls.webview.invokescriptasync.aspx

    The first parameter is the name of script, for example:

    <!DOCTYPE html>
    
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        <textarea id="textarea" placeholder="Enter text ..."></textarea>
    
        <script type="text/javascript">
        function insertText() {
            document.getElementById('textarea').focus();
            document.getElementById('textarea').innerHTML = "insertText";
        }
        </script>
    </body>
    
    </html>

    There is a script named "insertText" inside the above HTML, so we can invoke it like this:

    webview_demo.InvokeScriptAsync("insertText", null);

    For your advanced.html, we can manually add the following script:

    <script type="text/javascript">
        document.getElementById('textarea').focus();
        document.getElementById('textarea').innerHTML = "adhaskdhasodhihfvkjv";
    </script>

    The textarea will be filled when the page loads:

    But if you need to auto insert new data into textarea using InvokeScriptAsync() method, we found that there are some limitation in your HTML project, we can't change the content of textarea using script code.


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.


    Tuesday, November 4, 2014 9:02 AM
    Moderator
  • Thanks for the reply. I want this limited functionality in html editor and i tried all others but all those use gif images and i can't customize them to use in app for this functionality. All other html editors i have used implement this same method and also i can't make those run. If you can provide some sample or edit this project it will be quite helpful.
    • Edited by RohitrkKUmar Wednesday, November 5, 2014 7:12 AM
    Wednesday, November 5, 2014 5:22 AM