jkanetwork/CheckServer
1
0
Fork 0
mirror of https://gitlab.com/JKANetwork/CheckServer.git synced 2026-03-08 03:22:02 +01:00
Code Issues Releases Wiki Activity

Start again

Browse Source
This commit is contained in:
JKA Network
2020-10-04 17:14:00 +02:00
parent c0d3912413
commit 091f119048
4382 changed files with 1762543 additions and 9606 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
vendors/select2/docs/_includes/options/data/ajax.html vendored Normal file
View File

@@ -0,0 +1,147 @@
<section>
<h2 id="ajax">
Can Select2 be connected to a remote data source?
</h2>
<p>
Select2 supports connecting to a remote data source using the <code>ajax</code> option.
</p>
<h3>
How can I set the initially selected options when using AJAX?
</h3>
<p>
You can refer to the following Stack Overflow answer if you want to set the initial value for AJAX requests: <a href="http://stackoverflow.com/q/30316586/359284#30328989">Select2 4.0.0 initial value with AJAX</a>
</p>
<h3>
What should the results returned to Select2 look like?
</h3>
{% include options/not-written.html %}
<h3>
Is there a way to modify the response before passing it back to Select2?
</h3>
<p>
You can use the <code>ajax.processResults</code> option to modify the data returned from the server before passing it to Select2.
</p>
{% highlight js linenos %}
$('select').select2({
ajax: {
url: '/example/api',
processResults: function (data) {
return {
results: data.items
};
}
}
});
{% endhighlight %}
<h3>
A request is being triggered on every key stroke, can I delay this?
</h3>
<p>
By default, Select2 will trigger a new AJAX request whenever the user changes their search term. You can set a time limit for debouncing requests using the <code>ajax.delay</code> option.
</p>
{% highlight js linenos %}
$('select').select2({
ajax: {
url: '/example/api',
delay: 250
}
});
{% endhighlight %}
<p>
This will tell Select2 to wait 250 milliseconds before sending the request out to your API.
</p>
<h3>
How do I tell Select2 which URL to get the results from?
</h3>
<p>
When connecting Select2 to a remote data source, you have the option of using either a single endpoint (a single page which handles all requests) or a dynamic endpoint (one of many pages). You can point Select2 to a single endpoint during initialization by specifying a string for the <code>ajax.url</code> option.
</p>
{% highlight js linenos %}
$('select').select2({
ajax: {
url: '/path/to/search/endpoint'
}
});
{% endhighlight %}
<p>
If there isn't a single url for your search results, or you need to call a function to determine the url to use, you can specify a function for the <code>ajax.url</code> option, and this will be used instead. The query parameters will be passed in through the <code>params</code> option.
</p>
{% highlight js linenos %}
$('select').select2({
ajax: {
url: function (params) {
return '/some/url/' + params.term;
}
}
});
{% endhighlight %}
<h3>
I want to add more query parameters to the request, where can this be done?
</h3>
<p>
By default, Select2 will send the query term as well as the pagination data as query parameters in requests. You can override the data that is sent to your API, or change any of the query paramters, by overriding the <code>ajax.data</codE> option.
</p>
{% highlight js linenos %}
$('select').select2({
ajax: {
data: function (params) {
var query = {
search: params.term,
page: params.page
}
// Query paramters will be ?search=[term]&page=[page]
return query;
}
}
});
{% endhighlight %}
<h3>
The results that I am seeing never change
</h3>
<p>
Select2 expects that the results that are returned from the remote endpoint are already filtered ahead of time based on the search term. If your remote endpoint just returns the list of all possible options, you may be interested in using Select2's <a href="examples.html#data-array">support for data arrays</a>.
</p>
<h3>
Can an AJAX plugin other than <code>jQuery.ajax</code> be used?
</h3>
<p>
Select2 uses the transport method defined in <code>ajax.transport</code> to send requests to your API. By default, this transport method is <code>jQuery.ajax</code> but this can be changed.
</p>
{% highlight js linenos %}
$('select').select2({
ajax: {
transport: function (params, success, failure) {
var request = new AjaxRequest(params.url, params);
request.on('success', success);
request.on('failure', failure);
}
}
});
{% endhighlight %}
</section>

150
vendors/select2/docs/_includes/options/data/array.html vendored Normal file
View File

@@ -0,0 +1,150 @@
<section>
<h2 id="data">
Can I load data into Select2 using an array?
</h2>
<p>
While Select2 is designed to be used with a <code>&lt;select&gt;</code> tag
the data that is used to search through and display the results can be
loaded from a JavaScript array using the <code>data</code> option. This
option should be passed in during the initialization of Select2.
</p>
{% highlight js linenos %}
$('select').select2({
data: [
{
id: 'value',
text: 'Text to display'
},
// ... more data objects ...
]
});
{% endhighlight %}
<h3>
What properties are required on the objects passed in to the array?
</h3>
<p>
The <code>id</code> and <code>text</code> properties are required on each
object, and these are the properties that Select2 uses for the internal
data objects. Any additional paramters passed in with data objects will be
included on the data objects that Select2 exposes.
</p>
<h3>
Do the <code>id</code> properties have to be strings?
</h3>
<p>
Because the <code>value</code> attributes on a <code>&gt;select&lt;</code>
tag must be strings, the <code>id</code> property on the data objects must
also be strings. Select2 will attempt to convert anything that is not a
string to a string, which will work for most situations, but it is
recommended to force all of your ids to strings ahead of time.
</p>
<h3>
I can't select results with blank ids or an id of <code>0</code>!
</h3>
<p>
See <a href="#do-the-id-properties-have-to-be-strings">Do the <code>id</code> properties have to be strings?</a>.
</p>
<h3>
How should nested results be formatted?
</h3>
<p>
Nested results should be specified using the <code>children</code> property
on the data objects that are passed in. This <code>children</code> property
should be an array of data objects that are grouped under this option, and
the label for the group should be specified as the <code>text</code>
property on the root data object.
</p>
{% highlight js linenos %}
{
text: 'Group label',
children: [
{
id: 'nested-1',
text: 'First nested option'
},
// ... more data objects ...
]
}
{% endhighlight %}
<h3>
How many levels of nesting are allowed?
</h3>
<p>
Because Select2 falls back to an <code>&lt;optgroup&gt;</code> when
creating nested options, only
<a href="#how-many-levels-of-nesting-can-there-be">a single level of nesting</a>
is supported. Any additional levels of nesting is not guarenteed to be
displayed properly across all browsers and devices.
</p>
<h3>
Why are <code>&lt;option&gt;</code> tags being created?
</h3>
<p>
The <code>data</code> option is a shortcut that Select2 provides which
allows you to load options into your <code>select</code> from a data array.
</p>
{% include options/not-written.html %}
<h3>
My objects don&apos;t use <code>id</code> for their unique identifiers,
what can I do?
</h3>
<p>
Select2 requires that the <code>id</code> property is used to uniquely
identify the options that are displayed in the results list. If you use a
property other than <code>id</code> (like <code>pk</code>) to uniquely
identify an option, you need to map your old property to <code>id</code>
before passing it to Select2.
</p>
<p>
If you cannot do this on your server or you are in a situation where the
identifier cannot be changed, you can do this in JavaScript before passing
it to Select2.
</p>
{% highlight js linenos %}
var data = $.map(yourArrayData, function (obj) {
obj.id = obj.id || obj.pk; // replace pk with your identifier
return obj;
});
{% endhighlight %}
<h3>
My objects use a property other than <code>text</code> for the text that
needs to be displayed
</h3>
<p>
Just like with the <code>id</code> property, Select2 requires that the text
that should be displayed for an option is stored in the <code>text</code>
property. You can map this property from any existing property using the
following JavaScript.
</p>
{% highlight js linenos %}
var data = $.map(yourArrayData, function (obj) {
obj.text = obj.text || obj.name; // replace name with the property used for the text
return obj;
});
{% endhighlight %}
</section>

69
vendors/select2/docs/_includes/options/data/select.html vendored Normal file
View File

@@ -0,0 +1,69 @@
<section>
<h2 id="data-adapters-select-tag">
Can Select2 be used with a <code>&lt;select&gt;</code> tag?
</h2>
<p>
Select2 was designed to be a replacement for the standard <code>&lt;select&gt;</code> boxes that are displayed by the browser, so by default it supports all options and operations that are available in a standard select box, but with added flexibility. There is no special configuration required to make Select2 work with a <code>&lt;select&gt;</code> tag.
</p>
<h3>
Does Select2 support nesting options?
</h3>
<p>
A standard <code>&lt;select&gt;</code> box can display nested options by wrapping them with in an <code>&lt;optgroup&gt;</code> tag.
</p>
{% highlight html linenos %}
<select>
<optgroup label="Group Name">
<option>Nested option</option>
</optgroup>
</select>
{% endhighlight %}
<h3>
How many levels of nesting can there be?
</h3>
<p>
Only a single level of nesting is allowed per the HTML specification. If you nest an <code>&lt;optgroup&gt;</code> within another <code>&lt;optgroup&gt;</code>, Select2 will not be able to detect the extra level of nesting and errors may be triggered as a result.
</p>
<h3>
Can <code>&lt;optgroup&gt;</code> tags be made selectable?
</h3>
<p>
No. This is a limitation of the HTML specification and is not a limitation that Select2 can overcome. You can emulate grouping by using an <code>&lt;option&gt;</code> instead of an <code>&lt;optgroup&gt;</code> and <a href="http://stackoverflow.com/q/30820215/359284#30948247">changing the style by using CSS</a>, but this is not recommended as it is not fully accessible.
</p>
<h3>
How are <code>&lt;option&gt;</code> and <code>&lt;optgroup&gt;</code> tags serialized into data objects?
</h3>
<p>
Select2 will convert the <code>&lt;option&gt;</code> tag into a data object based on the following rules.
</p>
{% highlight js linenos %}
{
"id": "value attribute" || "option text",
"text": "label attribute" || "option text",
"element": HTMLOptionElement
}
{% endhighlight %}
<p>
And <code>&lt;optgroup&gt;</code> tags will be converted into data objects using the following rules
</p>
{% highlight js linenos %}
{
"text": "label attribute",
"children": [ option data object, ... ],
"elment": HTMLOptGroupElement
}
{% endhighlight %}
</section>