CEF4Delphi and GetElementIdValue

magi6162 · Post by **magi6162** » Thu Mar 24, 2022 1:29 pm

<body onload="initialize()">
  <div id="map_canvas" style="width:100%; height:100%"></div>
.....
<input type="hidden" id="Distanza" value="0">
....

I would like in Delphi 11 to access the id = "Distance" (element found in an htmlin page where I use javascript).
I use CEF4Delphi, but I can't figure out how to access that element.
I read the documentation and examples, but couldn't get what I wanted.
I understand that CEF uses separate threads for the "Delphi" part and the DOM part, but I don't understand what I have to write in both Delphi and JS.

salvadordf · Post by **salvadordf** » Sat Mar 26, 2022 9:46 am

Hi,

There are 3 ways to visit the DOM :

Using the CEF API
Using the DevTools methods
Using JavaScript

The most powerful way to visit the DOM is JavaScript but in some cases the other 2 ways may be more than enough.

Run the DOMVisitor demo and check all the options in the context menu. That demo shows how to use all methods to visit the DOM and there are several examples that show how to search an element by ID.

Read all the code comments and the linked documents.

magi6162 · Post by **magi6162** » Tue Apr 05, 2022 9:43 am

thanks,
what I have to do is assign, from delphi (Browser), a value to the "Distance" element, so that js (render) can read it.
I tried that, but it doesn't work.
Help, thanks

HTML:

Code: Select all

<!DOCTYPE html>
<html>
    <head>
        <title>Add Map</title>
            <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
            <link rel="stylesheet" type="text/css" href="mapCli.css" />
            <script src="mapCli.js"></script>
    </head>
    <body>
        <!--The div element for the map -->
        <div id="map"></div>
        
          <input type="hidden" id="listaCli" value="0">     <<<<<--------------------------------
          
        <!-- Async script executes immediately and must be after any DOM elements used in callback. -->
        <script src="https://maps.googleapis.com/maps/api/js?key=KKKKKKKKKK=weekly" async></script>
    </body>
</html>

JS:

Code: Select all

function initMap() {
  bounds = new google.maps.LatLngBounds();
...
    var testSelect = document.getElementById('listaCli');
    testSelect.addEventListener('change', function() {
        console.log('TTTTTT'+testSelect.value);
        flgnocoords = 2;
    });
    .....
 }

Delphi: (Chromium1: TChromium)

Code: Select all

    
    ....
    sst := ssp + '?' + 'alat='  + '&' +
                       'alon='  + '&' +
                       'ars='   + '&' +
                       'aind='  + '&' +
                       'afile=' + ssfile + '&' +
                       'flgoperazione=2' + '&' + 'from=' + 'newclienti';

    Chromium1.LoadURL(sst);
    Chromium1.ExecuteJavaScript('document.getElementById("listaCli").value = "qwerty";','',0);

Delphi:

Code: Select all

procedure TNewClienti.Chromium1ConsoleMessage(Sender: TObject;
  const browser: ICefBrowser; level: Cardinal; const message, source: ustring;
  line: Integer; out Result: Boolean);
begin
  if LeftStr( message,6) = 'TTTTTT' then
  begin
    ShowMessage(message);
  end;
    ....
end;

salvadordf · Post by **salvadordf** » Wed Apr 06, 2022 7:28 am

Many functions in CEF/Chromium are asynchronous and they return before the task is completed.
In those cases you need to implement an event that is triggered when that task is completed.

One of those asynchronous functions is TChromium.LoadURL.

TChromium.LoadURL returns before the browser has downloaded and processed all the web contents.

Use the TChromium.OnLoadEnd event or wait until TChromium.OnLoadingStateChange is executed with a False "isLoading" parameter to call the TChromium.ExecuteJavaScript function.

magi6162 · Post by **magi6162** » Thu Apr 07, 2022 9:41 am

Thanks

BriskBard, CEF4Delphi, WebView4Delphi, WebUI4Delphi and WebUI4CSharp

CEF4Delphi and GetElementIdValue

CEF4Delphi and GetElementIdValue

Re: CEF4Delphi and GetElementIdValue

Re: CEF4Delphi and GetElementIdValue

Re: CEF4Delphi and GetElementIdValue

Re: CEF4Delphi and GetElementIdValue