简体   繁体   English

将链接/图像添加到GwtBootstrap弹出框组件

[英]Adding links/images to the GwtBootstrap popover component

I'm using a Popover component of the GWtBootstrap - org.gwtbootstrap3.client.ui.Popover. 我正在使用GWtBootstrap的Popover组件-org.gwtbootstrap3.client.ui.Popover。 I need to add few Clickable images that invoke java method. 我需要添加一些调用java方法的Clickable图像。 As popover does not let you add any widget to its content, I can use the following code to add links 由于popover不允许您向其内容添加任何小部件,因此我可以使用以下代码添加链接

final Popover popover = new Popover();
final SafeHtml html = new SafeHtmlBuilder().appendHtmlConstant("<a href='' title='test add link'>link on content</a>").toSafeHtml();
popover.setHtml(html);

then invoking the Java method using one of the solution here Calling GWT Java function from JavaScript 然后使用以下解决方案之一调用Java方法: 从JavaScript调用GWT Java函数

But whole of this looks little ugly, I also think adding links/images using raw html is very fragile and will be vulnerable. 但是,整个过程看起来并不难看,我还认为使用原始html添加链接/图像非常脆弱,并且很容易受到攻击。

Is there any better way to have Popover's content having GWT widgets so that we can better control them, may be extending the Popover class could be one option. 有没有更好的方法让Popover的内容具有GWT小部件,以便我们可以更好地控制它们,可能是扩展Popover类可能是一种选择。 Any suggestions/hints/solution will be of great help. 任何建议/提示/解决方案都会有很大帮助。

One solution to this problem is to create a proper GWT button (ButtonA) outside the popover that do the same action as you want with the button in the popover. 解决此问题的一种方法是在弹出式窗口外创建一个适当的GWT按钮(ButtonA),该按钮与弹出式窗口中的按钮执行相同的操作。 Using the html code like the following we can create a button that in turn clicks the ButtonA. 使用如下所示的html代码,我们可以创建一个按钮,然后单击ButtonA。 I used something like this method to do it. 我用类似这种方法的东西来做。

Popover createPopoverWithButton(Runnable buttonAAction, String id)
{
    SafeHtml popoverButtonHtml= new SafeHtmlBuilder()
                .appendHtmlConstant("<button type=\"button\" id=\"myPopoverButton\" onclick=\"document.getElementById(\'" + id
                        + "\').click()\">Click to invoke java method</button>");
    Popover popover = new Popover("Title", popoverButtonHtml.asString());
    Button buttonA = new Button();
    buttonA.setId(id);
    buttonA.addClickHandler(new ClickHandler() {
            @Override
            public void onClick(final ClickEvent event) {
                buttonAAction.run();
            }

        });
        buttonA.setVisible(false);
   return popover;
}

As I said earlier that this is an improvement over the initial approach that I described in the question. 正如我之前所说的,这是对我在问题中描述的初始方法的改进。 Any improvement over this are most welcome as this solution still have HTML/Javascript which we intend to avoid in GWT. 由于此解决方案仍具有我们希望在GWT中避免的HTML / Javascript,因此对此上的任何改进都是最受欢迎的。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM