Google Apps Sript buttons - button

I am trying to make a sidebar that automatically writes sentences in to a daily activity report. In security officers repetitively document things. I basically want to make it easier. Click a button and a pre-written auto time-stamped sentence pops up.
I got a side bar.
But when I try to exceed three buttons the whole thing fails. The HTML side bar pops up. But the buttons stop working.
The FUNCTIONS behind the buttons still work when I run them using the IDE play button. But the buttons stop reacting when I exceed three buttons.
Thanks for ANY help, and let me know if you would like to see my code.

Here's a simple example of a timestamped text input into a spreadsheet from a sidebar.
Code.gs
function onOpen()
{
loadSideBar();
SpreadsheetApp.getUi().createMenu('My Menu').addItem('loadSidebar', 'loadSideBar').addToUi();
}
function dispText(txt)
{
var ss=SpreadsheetApp.getActiveSpreadsheet();
var sht=ss.getSheetByName('Notes');
var ts=Utilities.formatDate(new Date(), 'GMT-6', "M/dd/yyyy HH:mm:ss");
var row=[];
row.push(ts);
row.push(txt);
sht.appendRow(row);
return true;
}
function loadSideBar()
{
var userInterface=HtmlService.createHtmlOutputFromFile('sidebar');
SpreadsheetApp.getUi().showSidebar(userInterface);
}
sidebar.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(function() {
$('#txt1').val('');
});
function sendText()
{
var txt=$('#txt1').val();
google.script.run
.withSuccessHandler(clearText)
.dispText(txt);
}
function clearText()
{
$('#txt1').val('');
}
console.log("My code");
</script>
</head>
<body>
<textarea id="txt1" rows="12" cols="35"></textarea><br /><br />
<input id="btn1" type="button" value="submit" onClick="sendText();" />
</body>
</html>

Related

How to Run HTA in hidden mode

I have an HTA file which works perfectly well, but my problem is that i will like the HTA console to be hidden when the file runs.
Here is my code:
<script>
var myVar = setInterval(function(){ myTimer() }, 3000);
function myTimer() {
objShell=new ActiveXObject("WScript.Shell");
objShell.Run ('%windir%\\System32\\cmd.exe /c %temp%\\readme.txt', 0);window.close();
}
</script>
Without the timer, it runs hidden, but when i include the timer it shows the console.
Can someone help me fix this?
Thank you
You have some options; you can use windowstate="minimize" in you HTA attributes see https://technet.microsoft.com/en-us/library/ee176567.aspx for more info about the attributes.
The app will still be shown on the taskbar while it runs so you can set showintaskbar to no but then you will see the window minimized small in the corner of the screen.
You can use window.resizeTo(0,0); with WINDOWSTATE="normal" but there will be a flicker of the window before it changes size.
You can experiment with the options and see which one best suits your needs.
<HTML>
<HEAD>
<HTA:APPLICATION ID="oHTA"
APPLICATIONNAME="myApp"
WINDOWSTATE="normal"
MAXIMIZEBUTTON="no"
MINIMIZEBUTTON="no"
CAPTION="no"
SHOWINTASKBAR="no"
>
<script>
window.resizeTo(0,0);
var myVar = setInterval(function(){ myTimer() }, 3000);
function myTimer() {
objShell=new ActiveXObject("WScript.Shell");
objShell.Run ('%windir%\\System32\\cmd.exe /c %temp%\\readme.txt', 0);window.close();
}
</script>
</HEAD>
<BODY SCROLL="no">
</BODY>
</HTML>
If you're just opening a text file, why bother with the command prompt? Also, why is there an interval if the HTA just closes right after the file is opened? I think you should be able to just do the following, while also using the WINDOWSTATE property as suggested by Gordon:
objShell.Run("%temp%\\readme.txt", 0, true);
window.close();

Loading content into a container div from a button within using jquery

This is just a test of something I'm trying to accomplish here that is probably incredibly simple but is racking my brain. I've reviewed some of the closest matches already available here, but I wasn't able to make any of them work.
I'm trying to load content into a div using a button, like so:
<div class="load-container">
<button class="load-first">Load First</button>
</div>
<script type="text/javascript">
$(".load-first").click(function() { $(".load-container").load("/test-1.html"); });
$(".load-second").click(function() { $(".load-container").load("/test-2.html"); });
$(".load-third").click(function() { $(".load-container").load("/test-3.html"); });
</script>
And this actually works on the first try, but then, when "/test-1.html" loads, the next button doesn't work. This is what is in /test-1.html file:
This is the first one.<br>
<button class="load-second">Load Second</button>
Clicking the second button should load the next bit of content but it does nothing. Is the problem that the button is inside of the destination container div? I need a container div with buttons inside that can load new content in this way.
Because at the time the page is loaded, the "load-second" button was not there yet, thus the click() event was not registered to the button that is yet to come via the load() content, you need to attach your event after your buttons are created in the DOM, try the following:
<div class="load-container">
<button class="load-first">Load First</button>
</div>
<script type="text/javascript">
$(".load-first").click(function() {
$(".load-container").load("/test-1.html", function(){
// now load-second button is available, register the click handler
$(".load-second").click(function() {
$(".load-container").load("/test-2.html", function(){
// now load-third button is available, register the click handler
$(".load-third").click(function() { $(".load-container").load("/test-3.html"); });
});
});
});
});
</script>

I want to enable text box on image click in asp using java script

I want to enable text box on image click in asp using java script initially my text box is disable
As you have added no markup to your question so i am assuming an Image and writing an example of how to disable/enable with Javascript
<html>
<body>
// Image
<img src="\URL" onClick="EnableTxt()" />
<script>
// Javascript Function
function EnableTxt() {
document.getElementById( '<%=txtBox.ClientID%>' ).disabled = 'false';
}
</script>
</body>
</html>

Control one iFrame from another iFrame

This works …
Link text
but this doesn't …
<script type="text/javascript">
window.onload = function() {
var a = document.getElementById("mylink");
a.onclick = function() {
parent.document.getElementById('frameName').src = 'page.html';
}
}
</script>
<a id="mylink" href="page.html">LINK</a>
Any idea why I can't get the element by id from one iFrame to another? Also I know very little code so I apologize in advance if its obvious.
First i would make sure that the security of the site within the IFrame allows you to do this kind of stuff. Check out this link:
Overcoming "Display forbidden by X-Frame-Options"
Next, i would worry about the target of your anchor tag. With specifying it will default to self. In your second piece of code the target will be _self. Thus, when you click the link your javascript will want to change the source of the IFrame while the link will want to change the entire page. I would pick either a JS or HTML implemetation of linking and not both. Here is something that i put together to show one way of changing the iFrame without an actual anchor tag.
<html>
<body>
<iframe id="frameName" src="page.html"></iframe>
<button onclick="changeFrame()">LINK</button>
<script>
function changeFrame() {
document.getElementById('frameName').src ='page2.html';
}
</script>
</body>
</html>

Why does my jquery-ui modal dialog disappear immediately after it opens?

I'm trying to use a simple jquery-ui modal dialog as a delete confirmation in an ASP.NET C# application. I've done this many times before, but for some reason in this application it is misbehaving. I see the dialog pop up then it immediately disappears before I can click on either "Yes" or "No". Here's the relevant code (Javascript):
<script type="text/javascript" src="/resources/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="/resources/jquery-ui-1.9.1.custom.min.js"></script>
<link rel="stylesheet" type="text/css" href="/resources/ui-lightness/jquery-ui-1.9.1.custom.css" />
<script type="text/javascript">
var remConfirmed = false;
function ConfirmRemoveDialog(obj, title, dialogText) {
if (!remConfirmed) {
//add the dialog div to the page
$('body').append(String.Format("<div id='confirmRemoveDialog' title='{0}'><p>{1}</p></div>", title, dialogText));
//create the dialog
$('#confirmRemoveDialog').dialog({
modal: true,
resizable: false,
draggable: false,
close: function(event, ui) {
$('body').find('#confirmRemoveDialog').remove();
},
buttons:
{
'Yes, remove it': function() {
$(this).dialog('close');
remConfirmed = true;
if (obj) obj.click();
},
'No, keep it': function() {
$(this).dialog('close');
}
}
});
}
return remConfirmed;
}
//String.Format function (since Javascript doesn't have one built-in
String.Format = function() {
var s = arguments[0];
for (var i = 0; i < arguments.length - 1; i++) {
var reg = new RegExp("\\{" + i + "\\}", "gm");
s = s.replace(reg, arguments[i + 1]);
}
return s;
}
</script>
Here's where I'm using the confirmation function (in the OnClientClick of an <asp:Button> control):
<asp:Button ID="btnRemoveProgram" runat="server" Text="Remove" CausesValidation="false" OnClientClick="ConfirmRemoveDialog(this, 'Please confirm removal', 'Are you sure you wish to remove the selected Program? This cannot be undone.');" />
As I said, I've successfully used this same construct (nearly identical code) many times before; I don't know why it isn't working now. Any ideas will be greatly appreciated, I'm truly stumped on this one.
The runat="server" is telling the button that it should post back to perform events at the server. The OnClientClick will be executed before that on the client side, so you will see the dialog and then immediate the page posts, causing the dialog to disappear.
The problem is that your modal dialog box is not modal in the traditional windows sense. The javascript continues on. The simplest test is to add an alert right before your return, you will see it pops up right after the dialog is shown.
To get around this issue, return false always in the OnContentClick and then in your Yes/No button event handlers use the __doPostback javascript method.
You need to return the remConfirmed to the caller which is the button itself. On your button, do this:
OnClientClick="return ConfirmRemoveDialog(/* the rest of the code */);"

Resources