ExecuteScript and data-bind="foreach: xxx"

[FMI]

Hello the forum, hello Salvador

I'm using ExecuteScript in a program which is finally intended to send datas using web page.
For several operations like page navigation and filling somes edit controls, it works fine and I can reach the last page wich is used to send datas.
HTML page used KnockOut JS and is coded in HTML using data-bind like this :

Code: Select all

<table data-bind="foreach: proprietes" class="bordered-table zebra-striped vmiddle" style="border-top: none; margin-bottom: 5px;">
...
            <input type="text" data-bind="value: Prefixe" class="span1">
...
            <input type="text" data-bind="value: NumSection, name: NumSection" class="span1 required" style="width: 25px;" placeholder="AA">/
...
            <input type="text" data-bind="value: NumParcelle, name: NumParcelle" class="span1_5 required" placeholder="1234">
...
            <input type="text" data-bind="value: Surface, name: surface" class="span1_5 required" placeholder="1234">
...
            <input type="text" data-bind="value: NumVoie, name: NumVoie" class="span1_5" placeholder="0">
...
</table>

So I need to send datas to "proprietes" in differents fields "Prefixe", "NumSection", "NumParcelle", "Surface", "NumVoie".
It can have more than one line.
I think it's possible using ExecuteScript but I don't know how !!!

Did anyone have an idea ?

Thank you all

FMI

[salvadordf]

Hi,

The WebView2 API doesn't have any method to access the DOM so you will have to use JavaScript.

Search this in Google : javascript find element "data-bind"

You'll find pages with some useful information like these :
https://stackoverflow.com/questions/25116043/knockout-how-to-get-data-bind-keys-and-value-observables-using-element
https://stackoverflow.com/questions/17364586/get-element-of-data-binding-with-knockoutjs
https://stackoverflow.com/questions/54206925/document-queryselector-based-on-data-bind-name
https://stackoverflow.com/questions/46689825/get-element-by-name-using-knockout

Try your JavaScript code using the "console" tab in the DevTools window before using it in ExecuteScript. This way is much easier to debug your JS code.

[FMI]

Hi Savador

That's exactly what I want to do using ExcuteScript but I don't find any concrete example.
I already use DevTools console to debug.

I'll go to look yours links

[salvadordf]

I'm sorry but I'm not a JavaScript expert and I don't know knockout.js so I'm afraid I don't know the exact answer.

However, if you find some JavaScript code to set the data into those elements then all you have to do is this:

Code: Select all

MyJScode := 'my custom js code goes here';
TWVBrowser.ExecuteScript(MyJScode);

There are a lot of people trying to do that and using knockout.js directly seems to be the solution :
https://stackoverflow.com/questions/55340810/data-bind-works-fine-but-retrieving-dom-value-with-jquery-gives-undefined