Page 1 of 1
CEF4Delphi and GetElementIdValue
Posted: Thu Mar 24, 2022 1:29 pm
by magi6162
Code: Select all
<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.
Re: CEF4Delphi and GetElementIdValue
Posted: Sat Mar 26, 2022 9:46 am
by salvadordf
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.
Re: CEF4Delphi and GetElementIdValue
Posted: Tue Apr 05, 2022 9:43 am
by magi6162
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;
Re: CEF4Delphi and GetElementIdValue
Posted: Wed Apr 06, 2022 7:28 am
by salvadordf
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.
Re: CEF4Delphi and GetElementIdValue
Posted: Thu Apr 07, 2022 9:41 am
by magi6162
Thanks
