Set min and max bounds in page modal input. Closes #18
This commit is contained in:
bovenliggende
e24e5cd6a9
commit
85dcf6d271
|
@ -16,7 +16,9 @@ Or you can use the [hosted version](https://phyks.github.io/ampache_react/).
|
|||
## Requirements
|
||||
|
||||
To use this interface, you need:
|
||||
* An Ampache server on which you have an account.
|
||||
* An Ampache server on which you have an account, serving the [XML
|
||||
API](https://github.com/ampache/ampache/wiki/XML-API). Ensures your server
|
||||
has correct [CORS header](https://www.w3.org/wiki/CORS_Enabled) set.
|
||||
* A modern browser.
|
||||
|
||||
For now, this is a work in progress and as such, the [hosted
|
||||
|
|
|
@ -40,10 +40,18 @@ class PaginationCSSIntl extends Component {
|
|||
|
||||
// Parse and check page number
|
||||
const pageNumber = filterInt(this.refs.pageInput.value);
|
||||
if (pageNumber && !isNaN(pageNumber)) {
|
||||
if (pageNumber && !isNaN(pageNumber) && pageNumber > 0 && pageNumber <= this.props.nPages) {
|
||||
// Remove error class from input form
|
||||
this.refs.pageFormGroup.classList.remove("has-error");
|
||||
this.refs.pageFormGroup.classList.add("has-success");
|
||||
// Hide the modal and go to page
|
||||
$(this.refs.paginationModal).modal("hide");
|
||||
this.props.goToPage(pageNumber);
|
||||
} else {
|
||||
// Set error class on input form
|
||||
this.refs.pageFormGroup.classList.add("has-error");
|
||||
this.refs.pageFormGroup.classList.remove("has-success");
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -164,7 +172,9 @@ class PaginationCSSIntl extends Component {
|
|||
</div>
|
||||
<div className="modal-body">
|
||||
<form onSubmit={this.goToPage}>
|
||||
<input className="form-control" autoComplete="off" type="number" ref="pageInput" aria-label={formatMessage(paginationMessages["app.pagination.pageToGoTo"])} autoFocus />
|
||||
<div className="form-group" ref="pageFormGroup">
|
||||
<input className="form-control" autoComplete="off" type="number" ref="pageInput" aria-label={formatMessage(paginationMessages["app.pagination.pageToGoTo"])} min="1" max={this.props.nPages} step="1" defaultValue={this.props.currentPage} autoFocus />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div className="modal-footer">
|
||||
|
|
Bestand-diff onderdrukt omdat een of meer regels te lang zijn
Bestand-diff onderdrukt omdat een of meer regels te lang zijn
Bestand-diff onderdrukt omdat een of meer regels te lang zijn
Laden…
Verwijs in nieuw issue