javascript - Wicket: Select Multiple Rows (Shift-Click) - Stack Overflow

admin管理员组

文章数量:1434443

Is it possible to select multiple rows in Wicket by using clicking on a row, pressing the shift key and then clicking on another row?

I am using Wicket 6.20. I have figured out the code to select a single row, but I am not sure how to add the AJAX event to determine if the user has pressed the shift-key.

@Override
protected Item<T> newRowItem(final String id, final int index, final IModel<T> model) {
    final Item<T> rowItem = new OddEvenItem<>(id, index, model);
    rowItem.add(new AjaxEventBehavior("onclick") {

        private static final long serialVersionUID = 6720512493017210281L;

        @Override
        protected void onEvent(AjaxRequestTarget target) {

            SearchResultsRow row = (SearchResultsRow) rowItem.getModelObject();
            row.setSelected(!row.isSelected());

            parent.updateSearchResults(target);
        }
    });
    return rowItem;
}

Is it possible to select multiple rows in Wicket by using clicking on a row, pressing the shift key and then clicking on another row?

I am using Wicket 6.20. I have figured out the code to select a single row, but I am not sure how to add the AJAX event to determine if the user has pressed the shift-key.

@Override
protected Item<T> newRowItem(final String id, final int index, final IModel<T> model) {
    final Item<T> rowItem = new OddEvenItem<>(id, index, model);
    rowItem.add(new AjaxEventBehavior("onclick") {

        private static final long serialVersionUID = 6720512493017210281L;

        @Override
        protected void onEvent(AjaxRequestTarget target) {

            SearchResultsRow row = (SearchResultsRow) rowItem.getModelObject();
            row.setSelected(!row.isSelected());

            parent.updateSearchResults(target);
        }
    });
    return rowItem;
}

• javascript
• java
• html
• wicket

Share Improve this question Follow asked Jan 19, 2016 at 21:56 Michael MitchellMichael Mitchell 4122 bronze badges

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 6

I use this snippet for shift / ctrl ajax-click:

public class AjaxClickWithKeysBehavior extends AjaxEventBehavior
{

    public AjaxClickWithKeysBehavior()
    {
        super( "click" );
    }

    @Override
    protected void updateAjaxAttributes( AjaxRequestAttributes attributes )
    {
        super.updateAjaxAttributes( attributes );

        attributes.getDynamicExtraParameters().add( "return {'ctrl' : attrs.event.ctrlKey, 'shift' : attrs.event.shiftKey}" );
    }

    @Override
    protected void onEvent( AjaxRequestTarget target )
    {
        final RequestCycle requestCycle = RequestCycle.get();

        boolean isCtrl = requestCycle.getRequest().getRequestParameters().getParameterValue( "ctrl" ).toBoolean( false );
        boolean isShift = requestCycle.getRequest().getRequestParameters().getParameterValue( "shift" ).toBoolean( false );

        this.onClick( target, isCtrl, isShift );
    }

    protected void onClick( AjaxRequestTarget target, boolean isCtrl, boolean isShift )
    {
    }

}

WicketStuff-DataTables provides integration with https://datatables/. By using its Select extension it is possible to select rows as you need.

I just added support for the Select extension to master branch. It will be available with WicketStuff 7.2.0. You can see it in action in the infinite/virtual scroll example.

Here is a version that you can drop-in where you use a standard ajaxlink:

public abstract class KeyedAjaxLink extends AjaxLink<Object> {

  private static final long serialVersionUID = 1L;

  /**
   * @param p_id
   */
  public KeyedAjaxLink( String p_id ) {
    super( p_id );
  }

  /**
   * @param p_id
   * @param p_model
   */
  public KeyedAjaxLink( String p_id, IModel<Object> p_model ) {
    super( p_id, p_model );
  }

  @Override
  protected void updateAjaxAttributes( AjaxRequestAttributes p_attributes ) {
    super.updateAjaxAttributes( p_attributes );

    p_attributes.getDynamicExtraParameters().add( "return {'ctrl' : attrs.event.ctrlKey, 'shift' : attrs.event.shiftKey, 'alt' : attrs.event.altKey }" );
  }

  protected boolean isShiftPressed() {
    return isPressed( "shift" );
  }

  protected boolean isCtrlPressed() {
    return isPressed( "ctrl" );
  }

  protected boolean isAltPressed() {
    return isPressed( "alt" );
  }

  protected boolean isPressed( String p_keyCode ) {
    return RequestCycle.get().getRequest().getRequestParameters().getParameterValue( p_keyCode ).toBoolean( false );
  }
}

Just curious; why not using list view with checkbox for this? The solution to what you are trying to achieve seems more of Javascript coding then Wicket itself. I am sure you could find multiple answers on Stackoverflow for achieving multi row select from javascript.

For Wicket list view with checkbox, you can look at: https://cwiki.apache/confluence/display/WICKET/Listview+with+checkboxes

You might have valid reason to go with shift+click. But it might restrict you for the page you are on (if your table has pagination), and also without retaining the selection when e back.

Yes, it's possible. There are ponent org.apache.wicket.markup.html.form.ListMultipleChoice so I think you must use it.

This ponent provide behavior that you expect. You can read documentation in Wicket Docs

本文标签： javascriptWicket Select Multiple Rows (ShiftClick)Stack Overflow