Unable to show alert via Javascript in WP7 web browser control - javascript

I am trying to show alert box using javascript in a webpage using web browser control in WP7. The alert is not popping up. Is there anything wrong in the code or WP7 doesn't support it at all?
<phone:WebBrowser Name="browser" IsScriptEnabled="True" ScriptNotify="browser_ScriptNotify"
Source="Default.html"/>
Inside Default.html
<html><br>
<head><br>
</head><br>
<body onload="onLoad()"><br>
<script type="text/javascript"><br>
function onLoad() {<br>
alert("hello");<br>
}<br>
</script><br>
</body><br>
</html>

Are you able to get the default.html resource loaded? Have a look at http://blogs.msdn.com/b/dohollan/archive/2010/08/25/adventures-with-the-windows-phone-7-webbrowser-control.aspx first.
UPDATED TO INCLUDE SAMPLE CODE FOR HOW TO ACHIEVE AN INTENDED EFFECT:
The HTML:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title></title>
<script type="text/javascript" >
function ShowNameAlert(name) {
window.external.notify("Hello " + name);
}
</script>
</head>
<body onload="ShowNameAlert('Jojo');">
Bla bla
</body>
</html>
The C# code-behind:
private void SomeBrowser_ScriptNotify(object sender, NotifyEventArgs e)
{
MessageBox.Show(e.Value);
}
The XAML:
<phone:WebBrowser x:Name="SomeBrowser" ScriptNotify="SomeBrowser_ScriptNotify" IsScriptEnabled="True" Source="test.html"/>

This is how I solved it, I injected the javascript onto the webPage to which I navigate, and overrided the alert and confirm boxes
window.alert = function(__msg){window.external.notify(' + __msg + ');};
Then in the script notify function displayed that message using MessageBox. I hope it helps others too. The previous answer was a workaround, this is what I feel is the correct solution to my problem

Related

Javascript Not Working in HTML - In a Variety of Ways

Is it possible to load javascript without jQuery? I spent the better portion of yesterday evening simply trying to create the most basic HTML page with working CSS and Javascript and - despite the numerous methods I have tried - none of them have worked. Here is my basic HTML page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<link rel="stylesheet" href="style.css">
<script src="script.js" type="text/javascript"></script>
</head>
<body>
<div>On</div>
<input type="button" onclick="popup()" value="Click Me!">
</body>
</html>
This is being hosted locally on XAMPP, the page displays fine and the CSS works fine, the javascript is in the same directory as the html page and works fine when written inline with the HTML. However the js does not work in any of the following scenarios when trying to include it as an externality:
When application/javascript is used above it still doesn't work. All I receive in either case (in the Firebug script window) is "popup()" and that's it. Here is the script.js file:
function popup() {
alert("Hello World")
}
This js also doesn't work (I tried it even though I'm not parsing XML):
//<![CDATA[
function popup() {
alert("Hello World")
}
//]]>
nor this:
document.addEventListener('DOMContentReady', function popup() {
alert("Hello World")
})
nor this:
<script type="text/javascript">
function popup() {
alert("Hello World")
}
</script>
Not that I really expected it too, but I was getting desperate. If anyone knows what's going on, I'd appreciate any info.
I'm open to this being an issue with hosting this locally on XAMMP but find it doubtful as CSS and HTML are both flying. However the js works if I include it inline with the HTML(?). If it helps, when Firebug displays popup() in the script window it also shows an #conn1source connection.
UPDATE: according to one of the suggestions in the comments if I only write the following in the js file it works:
alert("Hello World")
however the function does not. So I'm guessing this means that I wrapped the function somehow incorrectly in the js file, but I'm following standard practice as far as I am aware.

my console.log does not work in my html page

I am very new to javascript but I can't go forward in learning because my console.log doesn't work AT ALL I will type in the console.log message and on my html page nothing shows up. i have try to debug it but I'm so new I don't know how all I can do is go to the forums and ask, it seem some people have the problem but, there is no good answer to the problem. I've tried every thing i know how to do (which isn't very much) but nothing works PLEASE HELP!!
this is my program
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script type="text/javascript">
console.log("Hello World!"</script>
</body>
</html>
i know that it has to be in dev tool to see it now but how do i make it show up in the html not in dev.?
there has to be a way!
i now now that document.write is the right way but that isn't working either
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script>
var name = "Nicholas";
document.write("Hello " + name);
if (name.length > 7 {
document.write("Wow you have a Really Long name!");
}
</script>
</body>
</html>
Technically, console.log is not supposed to show up on your HTML page. Rather, it shows up on your console's (web browser) log.
Even with all the correct answers provided, you can view your answer by visiting the Developer Tool -> Console (For Chrome, on Apple, it's Option + Command + J). For Windows, using Chrome, you hold the following keys: Ctrl+Shift+J
Here is a clip of the code and the log recorded by the console:
because you have to type console.log()
not control.log
Also, console.log needs to be either inside script tags, or in a separate javascript file. In your case you would have to do:
console.log("Hello, World!");
Try the below sample
<html>
<head>
<script type="text/javascript">
console.log("Hello World")
</script>
</head>
<body>
Hello
</body>
</html>
Unless you typed/edited your post.. that has an invalid Javascript.
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script type="text/javascript">
console.log("Hello World!");
</script>
</body>
</html>
You did not have a closing )
Ah, as others have explained.. Console is not your HTML page, its part of the web browser itself. For example, in google chrome press CTRL+SHIFT+J to show it.
Your after document.write

Opening links in other windows with Javascript

I am beyond new to JavaScript. Having only just differentiated it from Java as a programming language, I have decided to take it up, and want to try out some practical projects. But I have no idea what I'm doing wrong in terms of why my code is just screwing up.
The Idea
At work, I have a system where by simply opening a URL in my browser I can execute a script to reset a batch of ribbon screens. I don't know how the code works, but it does, and I'm happy. But I rather want to have a webpage I can go to that batch opens every webpage. It can be messy; at this point I only want the job done. So from what I understand, I've managed to cobble together some code.
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ribbon screen batch Reset</title>
<script>
var txt="Success!";
function open()
{
try
{
window.open("test.html");
document.write("<p>",txt,"</p><br />");
}
catch(err)
{
document.write("Something went wrong here.");
document.write("Error description: " + err.message + "\n\n");
alert("Interrupted due to errors. See webpage for details");
}
}
</script>
</head>
<body>
<img src="http://placehold.it/500x150" />
<h1>Ribbon screen batch reset Type 1 </h1>
<p>Version 1.0.3</p>
<button type="button" onclick="open()">Run code</button>
</body>
</html>
I promise you I can't see a problem, I have another document in the same folder called test.html, it's just when I click the button on index.html the button disappears, and I'm left with just a blank page. Help is much appreciated!
Two simple fixes:
1) open is a reserved word; call your function something else.
2) You must name the window, then use that name to manipulate it.
Code:
<html>
<head>
<script type="text/javascript">
var txt="Success!";
function openit()
{
try
{
testwin = window.open("test.html");
testwin.document.write("<p>",txt,"</p><br />");
}
catch(err)
{
document.write("Something went wrong here.");
document.write("Error description: " + err.message + "\n\n");
alert("Interrupted due to errors. See webpage for details");
}
}
</script>
</head>
<body>
<img src="http://placehold.it/500x150" />
<h1>Ribbon screen batch reset Type 1 </h1>
<p>Version 1.0.3</p>
<button type="button" onclick="openit()">Run code</button>
</body>
</html>
Rename your function to something else, like openMyPage. Using onclick="open()" will call document.open
I have no idea what the "ribbon screen" is but your code has a lot of problems.
First, being if you are using document.write() in <header> the outcome is not going to be visible and it's overall bad practice.
Second problem is this is completely wrong document.write("<p>",txt,"</p><br />");
the correct code would be document.write("<p>"+txt+"</p><br />");
Third, is you can write this whole thing as just one short line:
<button type="button" onclick="window.open("test.html")">Run code</button>
Hope this helps,
Cheers

JavaScript Reload Page Script

<html>
<head>
<script type="text/javascript">
function show_confirm(){
var r=confirm("Hello or Goodbye?");
if (r==true){
alert("Hello");
window.location.replace("http://www.google.com/");
} else {
alert("Goodbye");
}
}
</script>
</head>
<body>
<input type="button" onclick="show_confirm()" value="Show a confirm box" />
</body>
</html>
I'm learning JavaScript, and I'm using W3School's Tryit Editor, and this code wasn't working like I hoped. I want it to redirect me to google after someone hits 'OK' twice, but it doesn't seem to work. Can someone help me out?
The problem is that the Try-It Editor is using an IFrame. When I try it in Chrome and open up my developer console, I get the following error:
Refused to display document because display forbidden by X-Frame-Options.
This is because what your code is trying to do is change the location of the current frame, not the entire page.
You can do one of three things:
Try your HTML outside of an IFrame and you should get it to work then.
Try using window.top.location.replace("http://www.google.com/"); instead of window.location
If you must change the location of an iframe with JavaScript, you'll have to either do so outside of the frame or make sure it stays within the same domain as the parent document. (You'll notice that window.location.replace("http://www.w3schools.com") works just fine.)

Long Press - ASP.NET

I am in the process of handling a Long Press event in the JavaScript of an ASPX page but since I don't have much experience with JavaScript having a couple issues. I am working of a question which was already asked here.
When I run the code I get the message "$ is not defined" and when I change $("Button1") to ("Button1") then I get the message stating the mouseup function doesn't exist. The primary problem I'm having is accessing the aspx control properly. Below is my code.
<%# Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" language="javascript">
$(function () {
var pressTimer;
var longPress = 1000;
$("#<%= Label1.ClientID %>").bind("touchend", function (e) {
var d = new Date();
var timeDiff = d - pressTimer
if (timeDiff > longPress) {
document.getElementById("demo").innerHTML = "Mouse Up";
//actual logic here
}
return false;
});
$("#<%= Label1.ClientID %>").bind("touchstart", function (e) {
pressTimer = new Date();
return false;
});
});
</script>
<title>Long Press Testing</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:label ID="Label1" runat="server" text="Hold This Down" />
<br />
<p id="demo"></p>
</div>
</form>
</body>
</html>
Thanks for the help.
[EDIT] - Turns out I was missing the ready statement so the event is now firing as it should. This is the final version which is behaving properly. Also I wrote this to handle long press functionality on the iPad so if anyone is trying to do that this code is a good place to start.
You are missing jQuery script registration in head section like:
<script src="jquery.js"></script>
$ sign is jQuery's identifier, not JavaScript's.
Also, your buttons will not work, because you are referencing server button, but you must provide an id for JavaScript to work properly:
$("#<%= Button1.ClientID %>").mouseup(function () {
clearTimeout(pressTimer)
// Clear timeout
return false;
})
Looks like you are attempting to use jQuery (or another similar framework) without actually registering the appropriate script. You will need an <script/> block or some similar construct.
Looks like you havent included jquery in your project. you can include it by using the google hosting below, or go to jquery.com and download it and include it. your going to want to put in the Head tag above the other scripts you wrote. also, you might want to add a # before the id because it uses css selectors. Also, im not sure how much of the code will execute because thats a server button which will cause a post back.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Categories