Jump to content

Need guidance for field specific button(s)


androbey
 Share

Recommended Posts

Hi all, 

I have a rather special problem (at least for me) and did not find a proper way to solve it. 

On the system user template I have multiple "Options/Checkboxes" fields (multiple selectable values), where each field could have up to 30 options.

Now, it would be a lot of work to click many checkboxes, especially when there are a lot of users. 

What I would like to have is a button (or multiple buttons) next to the field to set default values (e.g. button "Option 1" would select certain fields and button "Option 2" would select even more fields). 
Default value sets and selectable options are static. 

Is there any (good) way to accomplish this? 

Unfortunately there's is no real dependency which default set should be used (if any), so no after save hook or similiar is suitable. It's totally up to the editor which default set should be used on a per user basis. 

Hope this makes sense.

Link to comment
Share on other sites

$wire->addHookBefore("Inputfield(name=roles)::render", function (HookEvent $event) {
  $field = $event->object;
  $field->appendMarkup = "
  <div class='uk-margin'>
    <button class='ui-button' data-options='1'>Options 1</button>
    <button class='ui-button' data-options='2'>Options 2</button>
  </div>
  <script>
  $(document).on('click', '[data-options]', function(e) {
    e.preventDefault();
    let options = $(e.target).data('options');
    if(options == '1') {
      $('input[value=37]').prop('checked', true);
      $('input[value=38]').prop('checked', false);
    }
    else if(options == '2') {
      $('input[value=37]').prop('checked', false);
      $('input[value=38]').prop('checked', true);
    }
  });
  </script>
  ";
});

Just adjust name=roles to name=your_options_field and value=37/38 to value=your_option_id (inspect via devtools)

Have fun 🙂 

IYFJMtp.png

  • Like 3
Link to comment
Share on other sites

Very nice, thank you! This helps me a lot. 

Just as a side note: As I have multiple options fields on the same page I'd have to add an additional name selector to the input selector ($('input[name="roles[]"][value=1]') of course escaped).

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...