I hope to rewrite the js popover, How can I do this?

  • Js popover title can be modified? Now you can see the url address in the js popover and the display is incomplete. I hope to rewrite the js popover and read the js popover title and fully display it as follows:

    I would like to change it to the following display:

  • @QtKing
    What is "js popover"? I can find no references. What exactly do you call/how does it come to appear?

    EDIT Ah, OK, it is e.g. https://www.w3schools.com/bootstrap/bootstrap_ref_js_popover.asp ? It would help if you gave a reference....

    So that says you have to specify title & data-content attributes. I suspect you're going to have problems trying to supply data-content to include a newline if that is what your screenshot implies you want. You could trying an embedded \n, but whether that will work or not I don't know.

  • @JonB You got me wrong. I want to rewrite Dialog, the alert window. I want to change its style. Change the title and redraw the contents of the Dialog.

  • @QtKing
    I don't know why you say "You got me wrong", setting existing dialog's title & data-content attributes would do just that.

    Anyway, whether you want to do that or whether you want to replace the dialog, won't you have to find where it's called and potentially have to change the popover.js file code to do what you want? Maybe this is a bootstrap [which you have never mentioned] rather than Qt question?

  • @JonB If you implement it in JS, you can implement it like this,

    <!DOCTYPE html>
    <html lang="en">
       <meta charset="UTF-8">
       <title>RERITE alert</title>
           window.alert = function (txt, time) {
               if (document.getElementById("alertFram")) {
               var alertDiv = document.createElement("DIV");
               alertDiv.id = "alertFram";
               alertDiv.style.position = "absolute";
               alertDiv.style.left = "50%";
               alertDiv.style.top = "40%";
               alertDiv.style.marginLeft = "-225px";
               alertDiv.style.marginTop = "-75px";
               alertDiv.style.width = "450px";
               alertDiv.style.height = "150px";
               alertDiv.style.background = "#ccc";
               alertDiv.style.textAlign = "center";
               alertDiv.style.lineHeight = "150px";
               alertDiv.style.zIndex = "10000";
               alertDiv.innerHTML = "<ul style='list-style:none;margin:0px;padding:0px;width:100%'><li style='background:#DD828D;text-align:left;padding-left:10px;font-size:14px;font-weight:bold;height:27px;line-height:25px;border:1px solid #F9CADE;'>Tip</li><li style='background:#fff;text-align:center;font-size:12px;height:120px;line-height:120px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE;'>" + txt + "</li><li style='background:#FDEEF4;text-align:center;font-weight:bold;height:27px;line-height:25px; border:1px solid #F9CADE;'onclick='doOk()'><input type='button' style='background-color: #FDEEF4;border: none;outline:none;' value='OK'/></li></ul>";
               var c = 0;
               this.timer = function () {
                   if (c++ >= time) {
               var ad = setInterval("timer()", 1000);
               this.doOk = function () {
               document.body.onselectstart = function () {
                   return false;
    <div onclick="alert('Hello ,New Dialog Style!!!')">
       <p>please click it !!!</p>

    But how do you override a Qt form if JS is just a normal alert implemented in Qt?

  • class WebPage : public QWebEnginePage
    	WebPage(QWidget *parent = 0);
    	~WebPage() {}
    	void javaScriptAlert(const QUrl &url, const QString& msg) override

Log in to reply

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.