How to display status message on web page - javascript

I have a bash script that checks for and deploys new .ear files to the JBoss server.I have linked this script to a web page, so that users can deploy their applications by clicking on the link.
I have also been able to set a status message that the application is being deployed, when a user clicks on the link.(Done using Javascript inside the HTML file).However I am not able to set a 'Deployment completed' message when the script completes execution.
Searching on the net was of little help,though I realized that what I wanted could be achieved using AJAX and requesting for the exit code of the script from the server.Being a system admin and having no knowledge of programming, I wish if somebody could help me out.Below is a part of my HTML file, if that would be of any help:
</table>
<FORM METHOD="LINK" ACTION="/cgi-bin/auto.sh">
<!--<INPUT TYPE="submit" VALUE="Deploy">--!>
<input type="submit" value="Deploy" onClick="showStatusMessage();">
<div id="statusMessage" style="display:none;">
<h3>Your application is being deployed.Please wait.</h3>
</div>
</FORM>
<script>
function showStatusMessage()
{
document.getElementById("statusMessage").style.display = "block";
}
function hideStatusMessage()
{
document.getElementById("statusMessage").style.display = "none";
}
</script>
</body>
</html>
Thanks.

The only way (i know of) to "know" once a server side deployment is complete. Would be to poll the server (with ajax) to check the status.

Related

Send Javascript Push Notification - AFTER Form POST and URL redirection

Use case (Django Project):
I want to log in on my login page -> Therefore I use this form in html (login.html):
<form class="loginform" action="" method="POST">
{% csrf_token %}
<div class="loginform">
{{form.as_p}}
</div>
<br>
<input type="submit" class="btn btn-success loginbtn" value="Login">
</form>
In case of successful log in I will redirect with DJANGO to this URL (localhost/welcome/)-> welcome.html:
LOGIN_REDIRECT_URL = "welcome"
I am able to send javascript notifications with alertify, but only when using simple things such as
click on it or mouseover:
function notification(text) {
console.log(text)
alertify.success(text);
}
I tried it with onsubmit="javascript:notification("")" in the html form tag, however this will
be displayed only BEFORE the URL redirection.
So my question is:
How is it possible to activate /send the push notification AFTER the URL redirection and in
case of successfull POST/ Log in?
I really appreciate your help! Thank you a lot!!
Javascript is client-side. That means your alertify.success(text); will be executed client-side, once server already did his render process.
The authentication process is server-side. So you have to make your server make your alertify a part of the rendered content.
Knowing that, you just have to change your LOGIN_REDIRECT_URL content page to include in it a call to notification:
<!-- your html template comes here -->
<script type="text/javascript">
notification('You are now logged in');
</script>
Be remembered that the notification will then display each time the person visits this page. You may want either to redirect him again, or to introduce a variable in Django to avoid displaying it again.

How to reload page in MVC dynamically

Can someone help me? I want to change my page when some status change. I don't want to see that refresh sign above.
<script type="text/javascript" language="javascript">
var idleInterval = setInterval("reloadPage()", 5000);
function reloadPage() {
location.reload();
}
</script>
<h2>Verlichting</h2>
<div class="Verlichting">
<div class="Border">
Verlichting Garage 1
</div>
<div class="ButtonVerlichting">
#if (Model.Verlichting1 == true)
{
<button class="On">Aan</button>
}
else if (Model.Verlichting1 == false)
{
<button class="Off">Uit</button>
}
</div>
<div class="Border">
Verlichting Garage 2
</div>
<div class="ButtonVerlichting">
#if (Model.Verlichting2 == true)
{
<button class="On">Aan</button>
}
else if (Model.Verlichting2 == false)
{
<button class="Off">Uit</button>
}
</div>
<div class="Border">
Verlichting Garage Grind
</div>
<div class="ButtonVerlichting">
#if (Model.VerlichtingGrind == true)
{
<button class="On">Aan</button>
}
else if (Model.VerlichtingGrind == false)
{
<button class="Off">Uit</button>
}
</div>
</div>
<div class="clear">
</div>
When one of the Models bool change.
My page need to change when some State change. The buttons control some lights.
Now I refresh te page every 5 seconds. But i want when one state change it change?
I work normally with C# MVC but not with javascript of something else.
You cannot refresh the View server side or "dynamically" with your current code.
HTTP is stateless.
HTTP works like this: a client (web browser in your case, like Chrome) has requested a resource from your server (/mywebsite/myview) because you entered a web address/URL/URI into your web browser location bar. That web address is a "mapping" to your server. An HTTP GET request is sent from your browser to your server and your server is running ASP.NET, IIS processes the request and passes the request to your ASP.NET MVC app. Your controller/view route entry matches and your ASP.NET app View code is served back to the web browser in the form of an HTTP response.
Your web browser parses the Response, containing CSS/HTML and Javascript and renders the view/page.
Your browser is now disconnected from the server. Your browser is not going to talk to your server again unless you take an action like pressing a button or entering a different URL into the location bar. On the other side, your server has no current way to talk to the client browser, your server is disconnected from your client/web browser.
This is a standard HTTP request/response.
You are looking for a push notification feature in your software. Since you are using ASP.NET and are not familiar with Javascript, SignalR would be the best way to keep a connection open between the web browser and your server via Web Sockets with a long polling fallback. SignalR is very easy to use and get setup.
Long polling is what you are currently doing, you are checking every 5 seconds for a change. You can continue to this but instead of getting all the HTML/CSS and Javascript again with a reload. Simply check some other Controller/API endpoint for a state change and then reload the whole page only when that state change occurs. This is actually a reasonably scalable solution from the sounds of your current needs.

Redirect to a SubDirectory via Form Input in JavaScript

When this project was first started we thought it would be super easy but after two days of failure, we are stumped.
Environment: MacBookPro - WordPress with Thrive Themes Architect
Goal: Create a simple form that allows visitors to input the name of a subdirectory into a form that instantly redirects them to that subdirectory upon clicking on the submit button.
Purpose: When a partner gives out their website URL which includes a subdirectory name sometimes the person fails to put in the subdirectory name and they go to the main site instead. This form would make it easy for them to get to the right place so that the right partner gets proper credit.
Theories: Could the redirect be being blocked by Browser security protocols or something? Is the coding off in some way? Is the method flawed?
Three of Many Failed Coding Attempts:
<script type="text/javascript">
function Redirect(){
var subDirectory= document.getElementById("sub_directory").value;
window.location.href= "https://www.thewatercoach.com/" + subDirectory;
}
</script>
<form>
<label>www.theWaterCoach.com/</label>
<input type="text" id="sub_directory">
<button onclick="Redirect()">Submit</button>
</form>
Results: The page simply refreshes or reloads the pre-existing URL, but doesn't work at all.
<script type="text/javascript">
function Redirect(){
var subDirectory= document.getElementById("sub_directory").value;
window.location.replace(subDirectory);
}
</script>
<form>
<label>www.theWaterCoach.com/</label>
<input type="text" id="sub_directory">
<button onclick="Redirect()">Submit</button>
</form>
Results: The page simply refreshes or reloads the pre-existing URL, but doesn't work at all.
<script type="text/javascript">
function Redirect(){
var subLink = document.getElementById("sub_Link");
var subDirectory= document.getElementById("sub_directory").value;
subLink.href = "https://www.theWaterCoach.com/" + subDirectory;
subLink.click();
}
</script>
<form>
<label>www.theWaterCoach.com/</label>
<input type="text" id="sub_directory">
<button onclick="Redirect()">Submit</button>
</form>
<a id="sub_Link" href="https://www.theWaterCoach.com/">.</a>
Results: This Coding Example did work reliably with FireFox but not on Chrome or Safari. It does not work via Chrome on a PC either. For testing purposes, you can enter Becca into the text box.
Any ideas or solutions will be greatly appreciated!
The submit button is located inside a form tag. Therefore, when you click submit, the browser simply sends a GET request to your homepage. The Javascript code to redirect got executed, but then it is terminated right before the GET request is sent.
Solution: You have to prevent the form from being submitted. Find out how: read this stackoverflow question.

Stop loading site to display a message

I wanna show my visitors a message before they enter the site, and then allow them to continue to the main site using a button. I don't wanna move the main sites location either.
Similar to this:
<script>
function continue() { /* function to continue loading site */ }
</script>
<p>This is a message. <button onclick="continue();">I agree</button></p>
<script>
//stop loading what's below when someone enters the site, and display only the message
</script>
<html>
<body>
<p>This is my main site with a lot of content.</p>
</body>
</html>
I can't just cover the main site, I don't want any of it's functions to run when the visitor is reading the message.
Can anyone point me in the right direction?
You can't stop loading page by JS. In some situation JS can stop render page. But it still readable by machine/show-source.
If you don't want cover site, you can hide some elements by style="display:none".
If page must be unreadable by machine you must realize this on server side:
<?php
session_start();
if(!empty($_POST['policy'])) $_SESSION['accepted_policy'] = true;
if(empty($_SESSION['accepted_policy'])) {
?><form action="?" method="post">
<input type="checkbox" value="1" name="policy"> I've accepted ...<br />
<input type="submit" > </form>
<?php die();
} ?>
normal page
If you don't want execute any JS before continue() you can run it from this function instead $.ready()

Laravel 500 HPHP error loading script

I'm trying to build a site with Laravel to do geolocation. I'm new to Laravel, so first wrote the code in PHP to call two external scripts, one from Google's geoloc API and another from my local server to tell the page what to do:
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true"></script>
<script src="geoloc.js"></script>
Then, in the body, I put a div for the map and a button to stop querying Google's server:
<body onload="geoloc()">
<p id = 'mapdiv'></p>
<button onclick="stopWatch()">
Stop
</button>
</body>
Everything works fine.
Then I tried to port it over to Laravel. Since this is a front end thing, I wanted to put it in the views, and thought I'd just attach it to the welcome.blade.php view for testing, since I know that one comes up ok. I created a js subfolder in the laravel/public folder, and put the script there. I then used an HTML helper in the header to call up the scripts:
{{ HTML::script('https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true'); }}
{{ HTML::script('\public\js\geoloc.js'); }}
I appended the PHP in the body:
<p onload="geoloc()" id = 'mapdiv'></p>
<button onclick="stopWatch()">
Stop
</button>
and get nothing. Debugging shows a GET 500 hphp invoke.
Thoughts?

Categories