Develop Reference

Updating heading tags dynamically

I have several heading tags with IDs named 'Cat1', 'Cat2', 'Cat3' etc.
<h3 id="Cat1"></h3>
After an Ajax call a function receives an array of category names and this array is passed into another function which I want to use to place each of the categories from the array, into each of the heading tags. This is what I have at present:
for(var x=0; x<category_array.length; x++) {
var word = category_array[x];
var identify = "Cat" + (x+1).toString();
document.getElementById(identify).innerHTML = word;
}
I am currently getting the following error:
Uncaught TypeError: Cannot set property 'innerHTML' of null
Firstly, why is this occuring and secondly, how can I successfully update my heading tags with each of the categories in the array?
EDIT: If I write 'Cat1' into the getElementById script, it will update the h3 tags. But, the variable identify does not seem to be read correctly.

The error is occurring because document.getElementById(identify) returns null, which happens when the element you're trying to find does not exist. Otherwise, your code looks correct.
Make sure you have enough Cat<N> elements on the page to fill. One way to debug this issue is to console.log(identify) then look at the HTML to see if you have all the elements that appear in the console.

addition in javascript is resulting in an object

I am tring to add 2 values together in a javascript application however when I try and do this the output I get is;
Total Price £[object Object]116.96
Where [object Object] is the value I am trying to add to 116.96
the code I am using to do the addition is bellow;
document.getElementById("getTotal").addEventListener("click", function()
{
var STotal = (($('#SeatPrice')+(subTotal)).toString());
$('#total').text(STotal);
});
these are where the values for '#seatPrice' and '#total' are derived from
$('#total').text(subTotal.toString());
$('#SeatPrice').text((($('td.selected').length)+count)*pricing);
If anyone has any ideas on how to resolve this issue please let me know.
Thanks!

The problem lies here: var STotal = (($('#SeatPrice')+(subTotal)).toString());
$('#SeatPrice') is a jquery function which returns an object - the html element you've searched for. So when you add that to your subTotal, you are adding the object to a string which, in javascript, will just create a string out of both.
You probably want to get the value of that element using something like $('#SeatPrice').val() or $('#SeatPrice').text()

Edit html text value using directives

In my app, I'm using some variable which contain a code instead of the value itself. This code matches one field of an array which items contain the code with the matching value. What I could do to display the name is a loop to find the value based on the code. But as my app has a lot of these, I would need to do it for each value.
Here is the array:
[{code: 'PN', name: 'Panasonic'}, {code: 'SN', name: 'Sony'}]
Therefore, I thought using an attribute would be much better and cleaner. I would like to put the following jade: div(json-array={{televisions}}) {{ code }} and change the displayed code with televisions[X].name. The problem is that I'm not so familiar with directives.
I tried to use the link function to catch the value (code) and the binded variable array ({{televisions}}) but I encountered two problems:
How can I modify the div value without modifying the binded variable (code)?
How do I get the array (televisions) within my directive?

I still wouldn't use a directive for that. It is a simple presentation issue and can be easily (and declaratively) handled in the view (yet the question lacks all necessary info in order to provide the most appropriate solution).
<div>{{getTelevisionName(tv.code)}}</div>
$scope.getTelevisionName = function (code) {
for (var i = 0; i < $scope.televisions.length; i++) {
var tv = $scope.televisions[i];
if (tv.code === code) return tv.name;
}
return '';
};

JavaScript populating and clearing <input> textbox

I got 6 "textboxex" and an Array with them.
<input id="slot0" type="text" /> id from 0 to 5, also Array named "slotarray". I want arrray and textboxes to be bound slotarray[0] with input id="slot0" etc.
First i needed function that will find first empty field in array (no matter if corresponding textbox is empty - but should) and put there string (short string - shortcode like "abc" or "sp1").
This function also need to populate bound textbox with long string.
If slotarray[2] == 'abc' then with the same number in ID (here be id="slot2") need to contain long string like "Abrasive Brilliant Conexant".
Here what i got
click to populate
and then function
function populate(shortstring,longstring) {
for (var i=0; i<6; i++) {
if (slotarray[i] == '') {
slotarray[i] = shortsrting;
slotid = 'slot' + i;
document.getElementById(slotid).value = longstring;
break;
}
}
}
With clearing at the moment of creating: ( Array('','','','','','') ), and textbox .value=''; its working as it should.
But then i figured out that i need function to clear textbox and bound array field. Not all but one specific for one clic. So instead of 6 functions i start to wrote
clear this field
for each of textbox, with different numbers and ids ofcourse, and clearing function:
function clear(arrayid, slotid) {
slotarray[arrayid] = '';
document.getElementById(slotid).value = '';
}
But this function do not clearing textbox neither array. I see that textbox has text, and i know that array isn't cleared because first function works finding first empty object...
What am i doing wrong here? its definition of "empty"/"cleared" filed/textbox? maybe i need to use more complex conditions? maybe it is something else.
Maybe i don't need array (i can manage to get rid of short-codes) and just make functions work only on textboxes?
Ok - i prepared jsfiddle demo with this, but even populating don't work..
http://jsfiddle.net/BYt49/11/

You can't use the keyword clear because refers to the (deprecated) function document.clear; so try to change the name of your "clear" function.

Ok, whatever you have written is fine. Just change to way you call your javascript.
Here is jsfiddle: http://jsfiddle.net/BYt49/20/

syntax error in GAS script editor

I have an error in the following code and I can't find why...
Using UiApp I define a couple of ListBox like this in a for loop
var critGlist = app.createListBox().setName('critGlist'+n).setId('critGlist'+n).addChangeHandler(refreshGHandler).addChangeHandler(cHandlerG).setTag(listItem[n]);
I added a TAG to be able to retrieve a value in the handler function because when I add items to this list I do it like this :
for(var c=0;c<listItem[n].length;++c){
critGlist.addItem(listItem[n][c],c);// the returned value is c, the value shown is listItem[n][c]
}
Then in my handler function I retrieve the value c that is the index of an element of the array listItem[n]
Since I stored a stringified value of this array as a tag I have to retrieve the tag first and then using the index I get the desired value...
That's where it becomes problematic !
I tried the 3 following codes :
var idx = Number(e.parameter['critGlist'+c]);// this works and I get the index
var item = e.parameter.critGlist0_tag.split(',')[idx];// this also works for a fixed index (0 here) but I need to use it in a for loop so I tried the code below
var item = e.parameter['critGlist'+c]_tag.split(',')[idx];// this generates an syntax error
// error message :"Signe ; manquant avant l'instruction. (ligne 129, fichier "calculatrice Global")"
// which means : missing ; before statement (line 129...
Am I missing something obvious ? How should I write it differently ?
Obviously it is the underscore that is not accepted... but how could I not use it ?
Well, I have a few other possibilities to get the result I want (using a hidden widget for example or some other temporary storage of even let the listBox return the value instead of the index) but still I'd like to know why this syntax is wrong ...
I'm not asking for a different code (as mentioned before there are a lot of other ways to go) , just some explanation about what is wrong in this code and this #!##å»ÛÁØ underscore ;)

You will need to put the whole property within the brackets as below
var item = e.parameter['critGlist'+c+'_tag'].split(',')[idx];// this generates an syntax error