gunghogeoduck/osem-fcy
1
0
Fork 0
mirror of https://github.com/openSUSE/osem.git synced 2026-08-13 19:54:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Ajaxify booth responsibles selectize interface

Browse source 
No need to load *all* users into a select input...
This commit is contained in:
Henne Vogelsang 2022-02-16 14:07:23 +01:00
parent 800bb28c34
commit 2e21079991
No known key found for this signature in database
GPG key ID: 97DDB66BDAF8D4D6
4 changed files with 77 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

86
app/views/booths/_form.html.haml
View file

@ -1,30 +1,74 @@
.container
.row
.col-md-8
= semantic_form_for(@booth, url: @url, html: { multipart: true }) do |f|
= f.input :title, as: :string, input_html: { autofocus: true }, required: true
= f.input :description, input_html: { rows: 5, data: { provide: 'markdown' } }, required: true,
hint: 'This field becomes public upon request acceptance'
= f.input :reasoning, input_html: { rows: 5, data: { provide: 'markdown' } }, required: true,
label: 'How it fits the conference'
= f.input :submitter_relationship, input_html: { rows: 5, data: { provide: 'markdown' } }, required: true,
label: 'Submitter\'s relation',
hint: 'e.g. employee, comunity manager, etc'
= f.input :website_url
= responsibles_selector_input f
= image_tag f.object.picture.thumb.url if f.object.picture?
= f.input :picture
= form_for(@booth, url: @url) do |f|
.form-group
= f.label :title, 'Title'
%abbr{title: 'This field is required'} *
= f.text_field :title, autofocus: true, required: true, class: 'form-control', placeholder: 'Title'
.form-group
= f.label :description, 'Description'
%abbr{title: 'This field is required'} *
= f.text_area :description, rows: 5, data: { provide: 'markdown' }, required: true, class: 'form-control'
%span.help-block
This field becomes public upon request acceptance
.form-group
= f.label :reasoning, 'How it fits the conference'
%abbr{title: 'This field is required'} *
= f.text_area :reasoning, rows: 5, data: { provide: 'markdown' }, required: true, class: 'form-control'
.form-group
= f.label :submitter_relationship, 'Submitter\'s relation'
%abbr{title: 'This field is required'} *
= f.text_field :submitter_relationship, rows: 5, required: true, class: 'form-control'
%span.help-block
e.g. employee, comunity manager, etc
.form-group
= f.label :website_url, 'Website URL'
%abbr{title: 'This field is required'} *
= f.text_field :website_url, class: 'form-control', required: true, placeholder: 'URL'
.form-group
= f.text_field :responsible_ids, multiple: true, class: "form-control", id: "booth_responsibles", placeholder: "Responsibles"
%span.help-block
= "The people responsible for the #{t 'booth'}. You can only select existing users."
.form-group
= image_tag f.object.picture.thumb.url if f.object.picture?
= f.label :picture, 'Picture'
= f.file_field :picture
%p.text-right
- if @booth.new_record?
= f.submit "Create #{(t'booth').capitalize } Request", class: 'btn btn-success'
- else
= f.submit "Update #{(t'booth').capitalize } Request", class: 'btn btn-success'
%button{type: 'submit', class: 'btn btn-success'}
- if @booth.new_record?
= "Create #{(t'booth').capitalize } Request"
- else
= "Update #{(t'booth').capitalize } Request"
:javascript
$(document).ready(function() {
$('#booth_responsible_ids').selectize({
plugins: ['remove_button'],
minItems: 2
} )
$('#booth_responsibles').selectize({
persist: false,
create: false,
valueField: 'id',
labelField: 'username',
searchField: 'username',
load: function(query, callback) {
if (!query.length) return callback();
$.ajax({
url: "#{search_users_path}.json",
type: 'GET',
dataType: 'json',
data: {
query: query,
},
error: function(res) {
console.log("selectize error");
callback();
},
success: function(res) {
console.log("selectize success");
// console.log(res);
callback(res.users);
}
});
}
});
});