Set min and max bounds in page modal input. Closes #18
This commit is contained in:
джерело
e24e5cd6a9
коміт
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">
|
||||
|
|
Різницю між файлами не показано, оскільки один чи декілька рядків занадто довгі
Різницю між файлами не показано, оскільки один чи декілька рядків занадто довгі
Різницю між файлами не показано, оскільки один чи декілька рядків занадто довгі
Завантаження…
Посилання в новій задачі