My website auto clear text in tag input html after 10 minutes. also I set idle timeout session 1 hour
enter image description here
IMO: I think you should use blazor for this if you are using MVC with Razor Pages or some js framework.
The server does not have to manage the presentation layer.
If you just want to clear the text in the HTML input after a certain time then you could try to use setTimeout() function of JavaScript.
In the function, you could reset the input value.
Example:
<!DOCTYPE html>
<html>
<head>
<title>demo</title>
<script>
const myTimeout = setTimeout(clrval, 3000);
function clrval() {
document.getElementById("txt1").value = "";
}
</script>
</head>
<body>
<h1>This is test page....</h1>
<h2>Textbox value will be cleared after 3 seconds.</h2>
Test Field : <input type="text" id="txt1" value="This is my sample text..."></br>
</body>
</html>
Output:
Let me know if you have further questions.
Related
I am building the login function with node.js, express,express-session, ejs.
This is the log-in page (i.e. index.ejs)
<html>
<head>
<meta charset="UTF-8">
<title>Video Chat Room</title>
<link rel="stylesheet" type="text/css" href="/css/style.css">
<style>
#message
{
color:red;
font-weight: bold;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$( document ).ready(function() {
var messageBox=document.getElementById("message");
<%
if (typeof errorField!="undefined") {
switch (errorField) {
case "email":%>
messageBox.innerHTML="Your email address has been used by another user, please use another one.";
document.getElementById("email").focus();
<% break;
case "logoutSuccess":%>
messageBox.innerHTML="<%=alias%> has successfully logged out.";
<% break;
}
}
%>
});
</script>
</head>
<body>
<form method="post" action="/login">
Nick name/Alias:<input type=text required name="alias" value="<%=((typeof user=='undefined')?'':user.alias)%>"><br>
Email Address:<input type=email id="email" required name="email" value="<%=((typeof user=='undefined')?'':user.email)%>"><br>
<input type="submit" value="Login">
</form>
<div id="message">
</div>
</body>
</html>
Here is the server-side code(i.e. server.js)
........
app.get('/',function (req,res) {
res.render('../ejs/index.ejs');
});
app.post('/login', function(req, res) {
var alias = req.body.alias;
var email = req.body.email;
var user=require("./classes/user.js");
user.alias=alias;
user.email=email;
if (user.login) {
req.session.user = user;
res.redirect('/home/');
} else {
res.locals.errorField="email";
res.locals.user=user;
res.render('../ejs/index.ejs');
}
It works fine, however, when the login process failed, although the web output the login page(i.e. index.ejs), the browser address bar still stay in "/login"; is it possible to change the browser address bar to "/" and the index.ejs can read the errorField and user value also?
If you want a user login error to go back to /, then you need to do res.redirect("/"). If you want to add some parameters to that page that can be used either in server-side rendering or client-side rendering, then the simplest way to do that is to add query parameters:
res.redirect("/?error=email")
Then, either your server-side rendering or some client-side Javascript can pick up that query parameter and display something like a message in the page that explains what happened.
There are lots of ways to do something like this. Here's a partial list:
Send data in a query parameter that server-side rendering picks up and adds some explanatory text to the page.
Send data in a query parameter that client-side Javascript picks up and adds some explanatory text to the page.
Set a cookie that contains an error message that your server-side rendering will pick upon the redirect and then clear the cookie.
Set some error data in the user session object on the server that your server-side rendering will pick up when rendering the redirected page and the clean that info from the session.
Use an Express middleware module built for these temporary messages called flash.
Render an error page from the server (without an immediate redirect) and then have a client-driven redirect back to "/" that occurs after a few seconds time. The client-driven redirect can either be from a <meta> tag or can be client-side Javascript on a timer.
I am using html code to create a dashboard where user can select a date and then based on selected date fetch some values from remote APIs and then show these values in the sheet.
I have html file something like:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#datepicker" ).datepicker();
});
</script>
</head>
<body>
<form>
<select name="Student" id="category">
<option value="" selected="selected">Select Student</option>
<option value="Abercrombie, Amber">Abercrombie, Amber(Gr 11)</option>
<option value="Yupa, Jason">Yupa, Jason(Gr 9)</option>
</select>
Date: <input type="text" id="datepicker" name="datepicker">
<input type="submit" value="Submit" onclick="myFunction()">
</form>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("category").value;
var x2 = document.getElementById("datepicker").value;
//document.getElementById("demo").innerHTML = x;
google.script.run.functionToRunOnFormSubmit(x, x2);
google.script.host.close();
}
</script>
</body>
</html>
I have code.gs as follows:
function fncOpenMyDialog() {
//Open a dialog
var htmlDlg = HtmlService.createHtmlOutputFromFile('HTML_myHtml')
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setWidth(500)
.setHeight(300);
SpreadsheetApp.getUi()
.showModalDialog(htmlDlg, 'Dashboard');
};
function functionToRunOnFormSubmit(fromInputForm, datevalue) {
Logger.log(fromInputForm);
Logger.log(datevalue);
SpreadsheetApp.getActiveSheet().getRange('B3').setValue(fromInputForm);
SpreadsheetApp.getActiveSheet().getRange('B4').setValue(datevalue);
};
When I select the function(fncOpenMyDialog()) from script-editor, It create a dashboard on the spreadsheet, Where I am able to select the date but as in functionToRunOnFormSubmit function I am logging the argument and then correspondingly setting the B3 and B4 cell values. It is not getting updated also It is not getting logged in the script editor.
The problem is you are calling "close" right after calling the google.script.run function which is an asynchronous ajax call.
In some cases it likely doesnt even give the browser enough time to start the ajax call or it gets cancelled because the page is closing. So sometimes it might reach the backend script, and sometimes wont.
take a look at the documentation and handle both success (close dialog from there) and failure (show error to the user)
https://developers.google.com/apps-script/guides/html/reference/run
While the documentation doesnt show it explicitly, you can hook both calls like this:
google.script.run.withFailureHandler(onFailure).withSuccessHandler(onSuccess).yourCall();
I am using handelbars as my templating engine and I am curious to whether I could edit the main handlebars file. What I can do at the moment is something like this:
main.handlebars:
<html>
<head>
</head>
<body>
<div id='headerBox></div>
<div id='contents'>{{{body}}}</div><!--all contents goes here-->
</body>
When I use this method I will could create templates e.g. home.handlebars etc.
But what If I wanted to change something dynamically in the main.handlebars? For example in my website, I would love to have a login form so I would like to have something like this in the main.handelbars:
<html>
<head>
</head>
<body>
<div id='headerBox>{{If logged in print name, if not print sign up}}</div>
<div id='contents'>{{{body}}}</div><!--all contents goes here-->
</body>
</html>
TLDR, how to I change something dynamically in the main handlebars skeleton.
Thanks!
You'll want to write a Handlebars Helper function. Since you didn't include anything about how you're verifying login, I'll write a little demo.
In your template file:
<div id='headerBox'>{{header}}</div>
Handlerbars.registerHelper('header', function() {
if (loggedIn) {
return //however you're getting a username
} else {
return Sign Up
}
});
I need to get all guids in an Entity by using Javascript crm 2011?for Ex:I have the Entity called Contact.In that contact Entity ther is an 5000 records.I need to get alll 5000 guid in a Javacript .
How to do this?
OData is limited to 50 records. To Retrive more than 50 records we have to use Paging
kindly check this RetrieveRecords
For a "bulk Get" you can try This solution
To get just one guid, you can use Web Resources(Simple HTML page).
<!DOCTYPE html>
<html>
<head>
<script>
function RetreiveGuid()
{
var guid = window.parent.Xrm.Page.data.entity.getId();
var cleanGuid =guid.replace(/{/g,"").replace(/}/g,"");
var entityName = window.parent.Xrm.Page.data.entity.getEntityName();
document.getElementById("demo").innerHTML = entityName + " : " + cleanGuid;
}
</script>
</head>
<body>
<h4>Using Web Resources to Get Guid</h4>
<p id="demo"></p>
<button type="button" onclick="RetreiveGuid()">Get Guid</button>
</body>
</html>
<script src="js/jquery-2.1.1.js"></script>
<script src="notify/js/notify.js"></script>
<script src="notify/js/notify-bootstrap.js"></script>
<form>
<div id="userInfoDiv" name="userInfoDiv" style="padding-top:100px;padding-left:100px;">
<span class="box pos-demo">Notifyjs position div</span>
</div>
</form>
<script type="text/javascript">
$(".pos-demo").notify(
"Welcome Guest",
{ position:"right" }
);
$.notify("This notofication is working ","success");
</script>
Note : The notification is not displayed.Where as $,notify("") without position is working fine.
I have the same problem. Though I cannot confirm this the cause I think its because at the time of the notification, the elements do not actually exist in the DOM (the web page), so there is nothing for the element to tie to. It fails silently, I used the Google developer tools and could see no error being generated.
My solution. If you create a function and call in body.onload the element appears. e.g
<body onload="notifyme();">
And then somewhere in the page (at the bottom perhaps)
<script>
function notifyme() {
var s = "Hello";
$("#myelem").notify(s);
}
</script>
I know this works a I have just tried it. Works every time, every page.