weixin_33722405 2017-09-30 08:18 采纳率: 0%
浏览 62

Ajax调试错误:无法为事件绑定侦听器”?

我有个问题,当我向复选框中添加标记属性“for”和标记属性“id”来绑定两个组件(复选框和标签)时,会引发Ajax调试错误:“无法为事件绑定侦听器”,因为元素不在DOM中。

下面是复选框代码:

      AjaxCheckBox checkBox = new AjaxCheckBox("variantBox", variantModel) {

                    @Override
                    protected void onUpdate(AjaxRequestTarget target) {
                        if (variantModel.getObject()) {
                            target.appendJavaScript(";utils_showElement(" + item.getModelObject().getId() + ");");
                        } else {
                            target.appendJavaScript(";utils_hideElement(" + item.getModelObject().getId() + ");");
                        }
                    }



                }; 

我在此代码中将属性修饰符添加到了复选框中:

checkBox.add(new VariantElementAttributeModifier("id",Model.of("checkbox_"+Long.toString(item.getModelObject().getId()))));

在这里,我用Label做了同样的操作:

      Label headerLabel = new Label("content", Model.of(item.getModelObject().getContent()));

      headerLabel.add(new VariantElementAttributeModifier("for",Model.of("checkbox_"+Long.toString(item.getModelObject().getId()))));

这里是 html代码:

    <!DOCTYPE html>
     <html lang="en" xmlns:wicket="http://maven.apache.org/FML/1.0.1">
      <head>
      <meta charset="UTF-8">
       <title>Title</title>
      </head>
      <body>

      <wicket:panel>




      <section class="column column_form">
        <div class="column__title">Опросный лист</div>
        <div wicket:id="container" class="column__content" style="height: 
       475px;">
            <div wicket:id="list" class="form">
                <div wicket:id="contentArea"></div>
                <div wicket:id="helpLabel"></div>

                <wicket:fragment wicket:id="variantFragment" 
         class="form__item checkbox">
                    <div class="checkbox__label" wicket:id="content">
        </div>
                    <input class="checkbox__input"   type="checkbox" 
        wicket:id="variantBox" />

                    <!--<input class="checkbox__input" type="checkbox" 
           name="input-name" id="checkbox_1"/>-->
                    <!--<label class="checkbox__label" for="checkbox_1"><b>текст</b><span>текст текст</span><span>текст текст</span></label>-->
                </wicket:fragment>
                <wicket:fragment wicket:id="Textfragment" 
        class="form__item form__textfield">
                    <label wicket:id="textlabel">лейбл</label>
                    <input type="text" wicket:id="textfield" />
                </wicket:fragment>
            </div>
        </div>
    </section>


</wicket:panel>
</body>
</html>

这是属性修饰符代码:

      package ru.simplexsoftware.constructorOfDocuments.Utils;
      import org.apache.wicket.AttributeModifier;
      import org.apache.wicket.model.IModel;


       public class VariantElementAttributeModifier extends AttributeModifier {
       public VariantElementAttributeModifier(String attribute, IModel<?> replaceModel) {

        super(attribute, replaceModel);
       }


       }

感谢帮助!

  • 写回答

1条回答 默认 最新

  • weixin_33697898 2017-09-30 12:29
    关注

    If you want to manually change the ID of an element, you have to use Component#setMarkupId(String).

    Using the AttributeModifier basicly just adds whatever attribute and value you want to the generated HTML. It doesn't tell Wicket about the new ID you want to use though, so Wicket internally still uses its own ID to generate the JavaScript for the AjaxCheckBox.

    Btw: If you have an HTML label tag and a corresponding HTML form component, you can also use the wicket:for attribute as in this example:

    <label wicket:for="nameInput">Name</label>
    <input wicket:id="nameInput">
    

    This tells Wicket which label and form component belong together, so it can generate the correct attributes and values on its own without any extra code in you Java class.

    评论

报告相同问题?

悬赏问题

  • ¥15 metadata提取的PDF元数据,如何转换为一个Excel
  • ¥15 关于arduino编程toCharArray()函数的使用
  • ¥100 vc++混合CEF采用CLR方式编译报错
  • ¥15 coze 的插件输入飞书多维表格 app_token 后一直显示错误,如何解决?
  • ¥15 vite+vue3+plyr播放本地public文件夹下视频无法加载
  • ¥15 c#逐行读取txt文本,但是每一行里面数据之间空格数量不同
  • ¥50 如何openEuler 22.03上安装配置drbd
  • ¥20 ING91680C BLE5.3 芯片怎么实现串口收发数据
  • ¥15 无线连接树莓派,无法执行update,如何解决?(相关搜索:软件下载)
  • ¥15 Windows11, backspace, enter, space键失灵