1

I have a problem using Wicket and JQuery. I am building a tree with a ul/li structure. However, Wicket inserts it's own elements which I just can't get rid of, for instance for such a structure:

<ul>
    <li><input type="checkbox"/></li>
    <li>
      <ul>
        <li><input type="checkbox"/></li>
        <li><input type="checkbox"/></li>
      </ul>
<ul>

You end up getting something like:

<ul>
    <span><li><input type="checkbox"/></li></span>
    <span><li>
      <wicket:panel><ul>
        <span><li><input type="checkbox"/></li></span>
        <span><li><input type="checkbox"/></li></span>
      </ul></wicket:panel>
     </span>
<ul>

So, the second code has some garbage which causes some issues with jquery, For instance, if I call the children() and siblings() methods on some elements of the first sample, I will get a consistent result, but with the second example, it just goes terribly complex to keep up with the "structure exceptions" (wicket:panel and span) that the Wicket framework causes.

All I want to do is to be able to set indeterminate checkbox values for which I found a nice jquery script:

http://css-tricks.com/indeterminate-checkboxes/

However, I find no way to make the script "ignore" the elements that Wicket introduces, or a way to adapt the script so that I can find the checkboxes it needs to validate.

What would be a clean approach to solve such an issue? I will be running into more, similar cases where the wicket element structure will be causing jquery scripts that have been tested on a sample page won't work anymore...

4

2 回答 2

4

Show your markup files with the Wicket id's. From the output you've shown i guess that:

  1. <wicket:panel> in the output html - to get rid of this use the procedure setStripWicketTags(true) http://ci.apache.org/projects/wicket/apidocs/6.x/org/apache/wicket/settings/IMarkupSettings.html#setStripComments%28boolean%29

  2. To get rid of the spans in the output html i guess that you are attaching wicket id's to the span element. You dont have to use the <span> element, you can directly add the wicket id to the <li> element: <li wicket:id="blah"></li>. Eventually on the wicket id attached to the <span> you can call setRenderBodyOnly(true). However i dont recommend this especially if you use ajax. I dont know if this helps - i would need to see the raw markup file.

于 2013-06-12T20:42:29.750 回答
0

You can use JQuery find because it is said:

The .children() method differs from .find() in that .children() only travels a single level down the DOM tree while .find() can traverse down multiple levels to select descendant elements (grandchildren, etc.) as well.

You can put also some class selectors or id's on nested li elements for easy searching.

于 2013-06-12T18:59:58.750 回答