We have a dropdown list that is dynamically populated using javascript (below). But it doesn't show in IE7.
This is the code that populates the options:
<script language="javascript" type="text/javascript">
window.onload = function() {
var today= new Date();
var year= today.getFullYear();
var val =0;
t2= 51;
grad_yr = document.getElementById("grad_yr");
grad_yr.options[0] = new Option("Year",val,false,false);
var y=year;
var yy=y;
for (var i=1; i <t2 ; i++) {
grad_yr.options[i] = new Option(y,y);
y=yy-1;
yy--;
}
}
</script>
This is the HTML:
<select name="grad_yr" id="grad_yr"></select>
What could be wrong?
EDIT: Ok, nevermind. Apparently, the list is actually being populated. It's just that we have another javascript that sort of moves the position of the options that's why it looks hidden. Thanks anyway!
You've created a name collision by using the same global variable name for your grad_yr variable and the select element. Comment out the line where you are pulling your grad_yr from the document by ID, as it is unneccessary:
//grad_yr = document.getElementById("grad_yr");
grad_yr.options[0] = new Option("Year", val, false, false);
Or, if you really do need to have a variable reference, just give your variable a different name, like this (or some such):
grad_yrVar = document.getElementById("grad_yr");
grad_yrVar.options[0] = new Option("Year", val, false, false);
...
for (var i = 1; i < t2; i++) {
grad_yrVar.options[i] = new Option(y, y);
y = yy - 1;
yy--;
}
...and it should work.
Try this
var grad_yr = document.getElementById("grad_yr");
Related
I'm having some confusion with closures
<script type="text/javascript">
$(function () {
for (var i = 0; i < 7; i++) {
var cname = '#closingTimePicker' + i;
$(cname).datetimepicker({
format: 'LT'
});
var oname = '#openingTimePicker' + i;
$(oname).datetimepicker({
format: 'LT'
});
$(oname).on("dp.change", function (e) {
$(cname).data("DateTimePicker").minDate(e.date);
});
$(cname).on("dp.change", function (e) {
$(oname).data("DateTimePicker").maxDate(e.date);
//Loop issue here
});
}
});
</script>
>
In the above script i'm confused how to apply closure so that i cloud get the correct date picker based on the loop. any suggestions and importantly explanation would be a great help.
Thanks,
every loop cname and oname gets a new value. so when dp.change on a oname object is triggered, cname has always the last value it gets in the loop.
try something like this:
<script type="text/javascript">
function initPicker(cname, oname)
{
// paste here the rest of the loop
}
for (var i = 0; i < 7; i++) {
var cname = '#closingTimePicker' + i;
var oname = '#openingTimePicker' + i;
initPicker(cname, oname);
}
</script>
[EDIT]
short explanation:
scopes live as long as their variables. so "scope" initPicker is 7 times initialized with different filled variables.
[/EDIT]
enjoy (-:
var dates =["09/27/2014","12/19/2013","01/13/2015",""];
var departments = ["Item1","Item2","item3",""];
var writespeed = 400;
$('.department_name').html(departments[fade-1]);
$('.date_name').html(dates[fade-1]);
The issue is in the following line of code:
$('.department_name').html(departments[fade-1]);
The issue is that in your loop, "fade", is not incremented. You can either use fade++ or assign it to a different variable and increment it.
Nothing but assigning a new variable worked.
var z = 1;
and then:
z++;
Its hard to tell from just the jquery, but I believe 'fade' needs to be incremented:
var fade = 1;
var depart_time = 1000;
console.log(0,fade);
$('.shutter').removeClass('closed-shutter open-move opened-shutter close-move');
function writeText(args) {
var dates =["09/27/2014","04/26/2014","03/17/2015"];
var departments = ["Item1","Item2","Item3"];
var writespeed = 700;
$('.write-text').each(function(){
$('.department_name').html(departments[fade-1]);
$('.date_name').html(dates[fade-1]);
fade++;
$(this).width('auto');
var w = $(this).width();
$(this).width(0).animate({width:w+'px'}, writespeed, function(){
if ($(this).hasClass('patient_name')) {
$(this).removeClass('write-text');
}
});
});
}
In Google App Scripts (GAS), I want to be able to add and remove TextBox and TextArea elements to a FlexTable (that's being used as a form) and not worry about how many there are. I've named the text elements based on a counter to make this process easier.
So, is there a way to get the number of inputs (TextBox + TextArea) passed to e.parameter after the form is submitted?
Here's the relevant code from the FlexTable:
function doGet() {
var app = UiApp.createApplication();
var flex = app.createFlexTable().setId('myFlex');
var counter = 0;
var row_counter = 0;
...
var firstnameLabel = app.createLabel('Your FIRST Name');
var firstnameTextBox = app.createTextBox().setWidth(sm_width).setName('input' + counter).setText(data[counter]);
flex.setWidget(row_counter, 1, firstnameLabel);
flex.setWidget(row_counter, 2, firstnameTextBox);
row_counter++;
counter++;
var lastnameLabel = app.createLabel('Your LAST Name');
var lastnameTextBox = app.createTextBox().setWidth(sm_width).setName('input' + counter).setText(data[counter]);
flex.setWidget(row_counter, 1, lastnameLabel);
flex.setWidget(row_counter, 2, lastnameTextBox);
row_counter++;
counter++;
...
var submitButton = app.createButton('Submit Proposal');
flex.setWidget(row_counter, 2, submitButton);
var handler = app.createServerClickHandler('saveProposal');
handler.addCallbackElement(flex);
submitButton.addClickHandler(handler);
var scroll = app.createScrollPanel().setSize('100%', '100%');
scroll.add(flex);
app.add(scroll);
return app;
}
And here's the code for the ClickHandler (notice that I currently have 39 elements in my FlexTable):
function saveProposal(e){
var app = UiApp.getActiveApplication();
var userData = [];
var counter = 39;
for(var i = 0; i < counter; i++) {
var input_name = 'input' + i;
userData[i] = e.parameter[input_name];
}
So, is there a way to get the number of elements (in this case 39) without manually counting them and assigning this value to a variable?
I'm new at this stuff and I'd appreciate your help.
Cheers!
The simplest way is to add a hidden widget in your doGet() function that will hold the counter value like this :
var hidden = app.createHidden('counterValue',counter);// don't forget to add this widget as a callBackElement to your handler variable (handler.addCallBackElement(hidden))
then in the handler function simply use
var counter = Number(e.parameter.counterValue);// because the returned value is actually a string, as almost any other widget...
If you want to see this value while debugging you can replace it momentarily with a textBox...
You can search for arguments array based object.
function foo(x) {
console.log(arguments.length); // This will print 7.
}
foo(1,2,3,4,5,6,7) // Sending 7 parameters to function.
You could use a while loop.
var i = 0;
var userData = [];
while (e.parameter['input' + i] != undefined) {
userData[i] = e.parameter['input' + i];
i++;
};
OR:
var i = 0;
var userData = [];
var input_name = 'input0';
while (e.parameter[input_name] != undefined) {
userData[i] = e.parameter[input_name];
i++;
input_name = 'input' + i;
};
Being new to javascript I have come across an odd issue. I have an array of elements and a variable, I want to compare that variable to all array elements and do something if they match .
Here is the snippet of code:
for (var i=0; i<country_arr.length; i++) {
option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]);
if(selected_country == country_arr[i]){
option_str.options[i].selected = true;
}
}
The array itself is an array of strings:
var country_arr = new Array("Republic of Ireland", "Northern Ireland");
For whatever reason this does not enter the if statement but oddly enough when i replace:
if(selected_country == country_arr[i])
with:
if(selected_country == "Republic of Ireland")
...it does and works perfectly.
Am I comparing the two elements incorrectly? Any help would be greatly appreciated.
UPDATE - FULL .js FILE:
Full External .js File:
//Create a new array, to contain the list of countries available.
var country_arr = new Array("Republic of Ireland", "Northern Ireland");
//Create a new array to hold a list of counties depending on country selection.
var s_a = new Array();
s_a[0]="";
s_a[1]="Carlow|Cavan|Clare|Cork|Donegal|Dublin|Galway|Kerry|Kildare|Kilkenny|Laois|Leitrim|Limerick|Longford|Louth|Mayo|Meath|Monaghan|Offaly|Roscommon|Sligo|Tipperary|Waterford|Westmeath|Wexford|Wicklow";
s_a[2]="Antrim|Armagh|Down|Dungannon|Derry|Tyrone";
function print_country(country_id, selected_country){
//Given the id of the <select> tag as function argument, it inserts <option> tags
var option_str = document.getElementById(country_id);
option_str.length=0;
option_str.options[0] = new Option('Select Country','');
option_str.selectedIndex = 0;
for (var i=0; i<country_arr.length; i++) {
option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]);
if(selected_country == country_arr[i]){
option_str.options[i].selected = true;
print_county('county',i);
}
}
}
function print_county(state_id, state_index){
var option_str = document.getElementById(state_id);
option_str.length=0; // Fixed by Julian Woods
option_str.options[0] = new Option('Select County','');
option_str.selectedIndex = 0;
var state_arr = s_a[state_index].split("|");
for (var i=0; i<state_arr.length; i++) {
option_str.options[option_str.length] = new Option(state_arr[i],state_arr[i]);
}
}
The function is called and the variable selected_country is set via a php file using:
<script language="javascript">
var selected = <?php echo json_encode($g_country); ?>;
print_country("country", selected);
</script>
The issue isn't the if statement, but that you have an error elsewhere. This is what's wrong:
option_str.options[option_str.length] = ...
option_str.length is probably not what you meant. Try:
option_str.options[option_str.options.length] = ...
...or better yet:
option_str.options.push(new Option(...));
Here's a working example.
Following the documentation sample, I'm trying to create a function that searchs for a numerated list in a google document and, if finds it, adds a new item to that list. But I get this error: Cannot find method setListId(string). (line 21, file "test") or, if I change line 21 content (replacing elementContentfor newElement), I get the message: Preparing for execution... and nothing happens. How to fix it?
This is my code:
function test() {
var elementContent = "New item testing"; // a paragraph with its formating
var targetDocId = "1R2c3vo9oOOjjlDR_n5L6Tf9yb-luzt4IxpHwwZoTeLE";
var targetDoc = DocumentApp.openById(targetDocId);
var body = targetDoc.getBody();
for (var i = 0; i < targetDoc.getNumChildren(); i++) {
var child = targetDoc.getChild(i);
if (child.getType() == DocumentApp.ElementType.LIST_ITEM){
var listId = child.getListId();
var newElement = body.appendListItem(elementContent);
newElement.setListId(newElement);
Logger.log("child = " + child);
}
}
}
Following my comment, I tried to play with your script to see what happened and I came up with that code below...
I'm not saying it solves your issue and/or is the best way to achieve what you want but at least it gives a result that works as expected.
Please consider it as a "new playground" and keep experimenting on it to make it better ;-)
function test() {
var elementContent = "New item testing"; // a paragraph with its formating
var targetDocId = DocumentApp.getActiveDocument().getId();
var targetDoc = DocumentApp.openById(targetDocId);
var body = targetDoc.getBody();
var childIndex = 0;
for (var i = 0; i < targetDoc.getNumChildren(); i++) {
var child = targetDoc.getChild(i);
if (child.getType() == DocumentApp.ElementType.LIST_ITEM){
while(child.getType() == DocumentApp.ElementType.LIST_ITEM){
child = targetDoc.getChild(i)
childIndex = body.getChildIndex(child);
Logger.log(childIndex)
i++
}
child = targetDoc.getChild(i-2)
var listId = child.getListId();
Logger.log(childIndex)
var newElement = child.getParent().insertListItem(childIndex, elementContent);
newElement.setListId(child);
break;
}
}
}