Develop Reference

handlebars +=,-= if condition met

I've been searching the net net for a while now trying to find a way to aggregate json array values with handlebars using +=, or -= if the condition is met. however i can't seem to find any guidelines on how to properly do so. can anyone guide me on how to convert this iteration into a handlebars helper?
var table = $("#table tbody");
$.getJSON("front-end/ajax/bethistory.php", function(data) {
var value = 0;
$.each(data, function(a, b) {
if (b.action == "win") {
value += parseFloat(b.coins);
} else if (b.action == "lose") {
value -= parseFloat(b.coins);
}
var tbody = $("<tr/>").append($("<td/>").html(b.action), $("<td/>").html(value))
table.append(tbody);
});
});
something like this?
var value = 0;
Handlebars.registerHelper("this_val", function(a,b) {
if (a == "win") {
value += parseFloat(b);
} else if (a == "lose") {
value -= parseFloat(b);
}
return value;
});

for anyone who needs this. i was able to figure it out thanks to this post
Handlebars.registerHelper("compute", function(array, options) {
var new_array = "",
value = 0,
count = array.length;
for (var i = 0; i < array.length; i++) {
var coins = Number(array[i]['coins']),
action = array[i]['action'];
if (action == "win") {
if (coins > 0) {
value += coins;
}
} else if (action == "lose") {
if (coins > 0) {
value -= coins;
}
}
array[i]['running'] = value;
new_array += options.fn(array[i]);
}
return new_array;
});

How to print the numbers in alert box?

This code is showing the alert box when the two numbers entered are same,now I want show the numbers in the alert box it is showing only one number,but I want to show each number which is same for example,if I enter 83 in two input boxes and 85 in other two input boxes,the alert box should show 83 and 85,you can not enter these numbers more than once.
function validateForm() {
for (var x = 0; x < 81; x++) {
for (var y = x + 1; y < 81; y++) {
if (document.forms["myForm"]['pk' + x].value == document.forms["myForm"]['pk' + y].value) {
if (document.forms["myForm"]['pk' + x].value == "") {
return true;
} else {
alert('You can not enter a number more than once');
return false;
}
}
}
}
return true;
}

A completely different take on it, 81 iterations only, rather than 3000+
function validateForm() {
var q = {}, a = [];
for (var i=0; i<81; i++) {
var value = document.forms["myForm"]['pk'+i].value;
if (value !== "") {
if (q[value]) {
if (q[value] < 2) {
a.push(value);
}
q[value] ++;
}
else {
q[value] = 1;
}
}
}
if(a.length) {
alert(a.join(', ') + ' You can not enter a number more than once');
return false;
}
return true;
}
This loops through all the values a single time, keeping a tally of how many of each value there is (var q) - if a tally of a value hits 2, the value is added to the array (var a). So, triples, quadruples etc, will only be reported once.
If a.length > 0, the alert is shown and false is returned

Do not use return inside the loop, else declare a variable say validate and store true and false values in it and return it at the end, else the function execution will stop at return. Modified code is:
function validateForm() {
var validate = true;
for (var x = 0; x < 81; x++) {
for (var y = x + 1; y < 81; y++) {
if (document.forms["myForm"]['pk' + x].value == document.forms["myForm"]['pk' + y].value) {
if (document.forms["myForm"]['pk' + x].value == "") {
} else {
alert('You can not enter a number more than once. Duplicate number is:'+ document.forms["myForm"]['pk' + x].value);
validate = false;
}
}
}
}
return validate;
}

From your code, this can help you
<script>
function validateForm() {
var val1,val2;
for (var x=0; x<81; x++) {
for (var y=x+1; y<81; y++) {
val1 = document.forms["myForm"]['pk'+x].value;
val2 = document.forms["myForm"]['pk'+y].value
if (document.forms["myForm"]['pk'+x].value==document.forms["myForm"]['pk'+y].value) {
if ( document.forms["myForm"]['pk'+x].value=="") {
return true;
}
else {
alert(val1 + 'and'+ val2 +',You can not enter a number more than once');
return false;
}
}else{
alert(val1 + 'and'+ val2 +',You can not enter a number more than once');
return false;
}
}
}
return true;
}
</script>

Check and alert for the null value

I need to check for the null values and alert them if there are any before getting saved. I have used this code but I am not able to alert the null values instead it is getting saved . .
function fn_publish() {
var SessionNames = getParameterByName('SessionName');
var MenuType = getParameterByName('MenuType');
var Date = getParameterByName('ForDate');
var publish = "Y";
Dates = Date.split("-");
Date = Dates[1] + "/" + Dates[2] + "/" + Dates[0];
var rows = [];
cols = document.getElementById('product_table').rows[1].cells.length - 1;
table = document.getElementById('product_table');
for (var i = 1; i <= cols; i++) {
for (var j = 0, row; row = table.rows[j]; j++) {
if (j == 0) {
cust = row.cells[i].innerText;
alert(cust);
} else if (j == 1) {
catlg = row.cells[i].innerText;
alert(catlg);
} else {
if (typeof (row.cells[i]) != "undefined") {
if (row.cells[i].innerText != "") {
//alert(SessionNames+"::"+MenuType+"::"+Date+"::"+catlg+"::"+row.cells[0].innerText+"::"+row.cells[i].innerText+"::"+cust+"::"+publish);
fn_insert(SessionNames, MenuType, Date, catlg, row.cells[0].innerText, row.cells[i].innerText, cust, publish);
} else {
jAlert("Please select a product", "ok");
return false;
}
}
}
}
}
jAlert("Menu Published", "ok");
}

if (row.cells[i].innerText != "") {
May be the cells are containing empty space in that. Better trim ad then compare.
if (row.cells[i].innerText.trim() !== "") {
Also instead of innerText use textContent which is common in most modern browsers.
if (row.cells[i].textContent.trim() !== "") {

Checkboxes and trying to save the state of all checkboxes for the user when they return

function getFormState() {
var fields = document.getElementsByTagName('form')[0].elements;
if (fields.length === 0) {
return;
};
for (var i = 0; i <= fields.length - 1; i++) {
var name = fields[i].getAttribute('name');
if (document.getElementByTagName('name').checked === true) {
localStorage.setItem('name', "true");
} else {
localStorage.setItem('name', "false");
}
}
}
function fillFormState() {
var fields = document.getElementsByTagName('form')[0].elements;
if (fields.length === 0) {
return;
};
for (var i = 0; i <= fields.length - 1; i++) {
var name = fields[i].getAttribute('name');
getStatus = localStorage.getItem('name'); {
if (getStatus === "true") {
console.log("its checked");
document.getElementByTagName("name").setAttribute('checked', 'checked');
} else {
console.log("its not checked");
}
}
}
} // run the below functions when the web page is loadedwindow.onload = function () {
// check if HTML5 localStorage is supported by the browser
if ('localStorage' in window && window['localStorage'] !== null) {
// get the form state
getFormState();
// save the state of the form each X seconds (customizable)
setInterval('fillFormState()', 1 * 1000);
}
};
But it doesn't seem to work. And Im trying to figure out why. Im not very experienced with javascript so it might be quite obvious. Sorry for that. Im trying.

I'm guessing your localStorage is never being set because of this loop:
for (var i = 0; i <= fields.length - 1; i++) {
var name = fields[i].getAttribute('name');
if (document.getElementByTagName('name').checked === true) {
localStorage.setItem('name', "true");
} else {
localStorage.setItem('name', "false");
}
}
There is no document.getElementByTagName, and you are also searching for "name" instead of your variable name.
for (var i = 0; i <= fields.length - 1; i++) {
var name = fields[i].getAttribute('name');
if (fields[i].checked === true) { //Check the current field
localStorage.setItem(name, "true"); //Set the actual name, not "name"
} else {
localStorage.setItem(name, "false");
}
}

jQuery limit "Dropdown Check List" selects

I'm using jquery with dropdownchecklist item.
this is my code to config selectbox.
jQuery('#selectbox').dropdownchecklist({ width: 120, maxDropHeight: 100, firstItemChecksAll: false, emptyText: 'Select' });
I want to limit the select for only 2 selects.
If the user select 2 options all others item will disable for selecting.
How can I do it?
Update:
I found the easiest way to do this
function Selectbox_limit(jidList) {
var jids = '';
var counter = 0;
for(var i=0; i<jidList.options.length; i++) {
if(jidList.options[i].selected == true)
counter++;
if(counter >= 2) {
jidList.options[i-1].selected = false;
jQuery("#selectbox").dropdownchecklist("destroy");
jQuery("#selectbox option").attr('disabled','disabled');
jQuery("#selectbox option:selected").attr("disabled","");
jQuery('#selectbox').dropdownchecklist({ _propeties_ });
return;
} else if(counter < 2) {
jQuery("#selectbox").dropdownchecklist("destroy");
jQuery("#selectbox option").attr("disabled","");
jQuery('#selectbox').dropdownchecklist({ _propeties_ });
return;
}
}

The dropdownchecklist add the class active to the check boxes so you can use it like this:
$('.active').change(function () {
var num = 0;
$('.active:checked').each(function () {
num++;
});
if(num >= 2)
{
$('.active:checked').attr("disabled", "disabled");
$('.active:checked').each(function () {
$(this).removeAttr();
});
}
else
{
$('.active').removeAttr("disabled", "disabled");
}
});

here is a sample of a jQuery Dropdown Check List with limit
onItemClick: function(checkbox, selector){
var justChecked = checkbox.prop("checked");
var checkCount = (justChecked) ? 1 : -1;
for( i = 0; i < selector.options.length; i++ ){
if ( selector.options[i].selected ) checkCount += 1;
}
if ( checkCount > 3 ) {
alert( "Limit is 3" );
throw "too many";
}
}

You can do it by this
var $b = $('input[type=checkbox]');
if(($b.filter(':checked').length)>2){
$b.attr("disabled", true);
}
or you can use
$(':checkbox:checked").length
$(":checkbox").filter(':checked').length
hope it help.