Set min and max bounds in page modal input. Closes #18

Este commit está contenido en:
Lucas Verney 2016-08-12 12:06:34 +02:00
padre e24e5cd6a9
commit 85dcf6d271
Se han modificado 5 ficheros con 26 adiciones y 14 borrados

Ver fichero

@ -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

Ver fichero

@ -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">

Las diferiencias del archivo han sido suprimidas porque una o mas lineas son muy largas

Las diferiencias del archivo han sido suprimidas porque una o mas lineas son muy largas

Las diferiencias del archivo han sido suprimidas porque una o mas lineas son muy largas