Added range slider to gardensize and price

This commit is contained in:
Nedim Uka
2019-05-29 11:03:01 +02:00
parent de3c76315e
commit 1a8ac3fba4
10 changed files with 154 additions and 104 deletions

View File

@@ -3,27 +3,4 @@
<h2>Koliko okućnice tražite ?</h2>
</div>
<form method="POST" id="form-gardensize">
<div class="row center-align">
<ul class="collection with-header">
<% for(const gardenSize of gardenSizes) { %>
<li class="collection-item" >
<div id="<%= gardenSize.id %>" onclick="saveAndSubmit(this.id)"><%= gardenSize.title %>
<a href="#" class="secondary-content">
<i class="material-icons">send</i>
</a>
</div>
</li>
<% } %>
</ul>
<input type="hidden" name="gardensize" id="gardensize" />
</div>
</form>
<script>
function saveAndSubmit(id) {
$("#gardensize").val(id);
$("#form-gardensize").submit();
}
</script>
<% include partials/range %>

View File

@@ -0,0 +1,56 @@
<form method="POST" id="form-range">
<div>
<div class="row center-align">
<h6>Od</h6>
</div>
<p class="range-field">
<input
name="from"
id="from"
type="range"
value="<%= rangeFrom.value %>"
min="<%= rangeFrom.min %>"
max="<%= rangeFrom.max %>"
step="<%= rangeFrom.step %>"/>
</p>
<div class="row center-align">
<h6>Do</h6>
</div>
<p class="range-field">
<input
name="to"
id="to"
type="range"
value="<%= rangeTo.value %>"
min="<%= rangeTo.min %>"
max="<%= rangeTo.max %>"
step="<%= rangeTo.step %>"/>
</p>
</div>
<div class="col s6 push-s3">
<a id="btnsubmit" href="#" class="welcome-center-button waves-effect waves-light btn">
Dalje
</a>
</div>
</form>
<script>
$(document).ready(() => {
$("#btnsubmit").click(() => {
var from = $("#from").val();
var to = $("#to").val();
console.log("From " + from + " " + to);
if (parseInt(from, 10) >= parseInt(to, 10)) {
alert("\"Od\" vrijednost ne smije biti veca od \"Do\" vrijednosti ")
return;
}
$("#form-range").submit();
});
});
</script>

View File

@@ -3,27 +3,4 @@
<h2>Koja Vam okvirna cijena odgovara ?</h2>
</div>
<form method="POST" id="form-price">
<div class="row center-align">
<ul class="collection with-header">
<% for(const price of prices) { %>
<li class="collection-item" >
<div id="<%= price.id %>" onclick="saveAndSubmit(this.id)"><%= price.title %>
<a href="#" class="secondary-content">
<i class="material-icons">send</i>
</a>
</div>
</li>
<% } %>
</ul>
<input type="hidden" name="price" id="price" />
</div>
</form>
<script>
function saveAndSubmit(id) {
$("#price").val(id);
$("#form-price").submit();
}
</script>
<% include partials/range %>

View File

@@ -3,47 +3,4 @@
<h2>Od koliko kvadrata tražite nekretninu ?</h2>
</div>
<form method="POST" id="form-size">
<div>
<div class="row center-align">
<h6>Od</h6>
</div>
<p class="range-field">
<input name="from" id="from" type="range" value="0" min="0" max="250" />
</p>
<div class="row center-align">
<h6>Do</h6>
</div>
<p class="range-field">
<input name="to" id="to" type="range" value="50" min="0" max="250" />
</p>
</div>
<div class="col s6 push-s3">
<a id="btnsubmit" href="#" class="welcome-center-button waves-effect waves-light btn">
Dalje
</a>
</div>
</form>
<script>
$(document).ready(() => {
$("#btnsubmit").click(() => {
var from = $("#from").val();
var to = $("#to").val();
console.log("From " + from + " " + to);
if (parseInt(from, 10) >= parseInt(to, 10)) {
alert("\"Od\" vrijednost ne smije biti veca od \"Do\" vrijednosti ")
return;
}
$("#form-size").submit();
});
});
// function saveAndSubmit(id) {
// }
</script>
<% include partials/range %>