[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

Simple ajax... asp not working

Posted on 2013-05-23
15
Medium Priority
?
346 Views
Last Modified: 2013-05-30
The attached zip ASP file includes an ajax app (or just simulation); where on mouseover the links, portion of the page should pop up. But, the pop-up doesn't show up.

Question: What is wrong with this application? The page information doesn't show up.

Thank you.
AjaxTest.zip
0
Comment
Question by:Mike Eghtebas
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 6
15 Comments
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 39193156
The Firefox Error Console says:

Timestamp: 5/23/2013 7:41:05 PM
Error: ReferenceError: url is not defined
Source File: http://10.202.46.40/ee/eghtebas/AjaxTest/script.js
Line: 39

Works if you click on the links.
0
 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 39193175
Hi Dave,

Thanks for the post. Please see the attached image; it shows how a popup displays part of the information from the link prior to clicking on the link to navigate to it.

The question still remains what do I need to make this happen?

I will check line Line: 39 now. brb

Mike
Popup.png
0
 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 39193206
I added alert(url); in:
function showPreview(evt){
	if(evt) {
	    var url = evt.target;
	    alert(url);
	}else{
		evt = window.event;
		var url=evt.srcElement;
	}
	xPos=evt.clientX;
	yPos=evt.clientY;
}
.
.

Open in new window


What I am getting is http://localhost:64520/jsintro/2000-09.html

not ../jsintro/2000-09.html

I see that the problem is because the files are not in the server-specific (localhost) folder. For example folder www in tomcat for php applications.

I have not installed IIS in this computer so, where should I move my folders to?

please see:

http://www.experts-exchange.com/Programming/Languages/.NET/ASP.NET/Q_28136202.html
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 39193213
This is my Default.aspx possibly missing lots on server side tags:

How can I revise it to remedy the problem?

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html>

<html>
<head>
	<title>Smart Ajax Links</title>
	<link rel="stylesheet" rev="stylesheet" href="script.css" />
    <script src="script.js" type="text/javascript"></script>
</head>
<body>
<h2>A Gentle Introduction to JavaScript</h2>

<ul>
	<li><a href="../jsintro/2000-08.html">August article</a></li>
	<li><a href="../jsintro/2000-09.html">September article</a></li>
	<li><a href="../jsintro/2000-10.html">October article</a></li>
	<li><a href="../jsintro/2000-11.html">November article</a></li>
</ul>
<div id="previewWin"> </div>
</body>
</html>

Open in new window

0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 39193228
Your aspx file is fine.  It's actually just an HTML file, there is no ASP in there, and I just renamed it to 'default.html' and removed the first line.  And the links were fine in the directory structure that was in your zip file.  I could click on the links and the pages would appear so that means they were correct.  Adding '../' will break it, not help.

Your actual problem is that AJAX must be run on a web server.  The xmlHTTPrequest by definition makes a request to a server and not just a file.  Even then, you still will need to fix the problem on line 39 where the script gets to that line without the 'url' being defined.
0
 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 39193363
re:> Your actual problem is that AJAX must be run on a web server.

This is why I want to put my files into the server. The question is, do I need to use IIS for that?

Visual Studio runs some applications (emulates server) without IIS installed. So, how can I run ajax (where do I put the files) without IIS?

Also,

Re:> The Firefox Error Console says...

How did you check js using FireFox? Please add your response to my another open question at:
Give me some steps. I have firebug and DOM inspector add-ons installed.

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28137713.html

Thanks,

Mike
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 39193427
This project is just HTML and javascript and Visual Studio as far as I know (since I don't use it) is not the place to test this.  The 'web server' in Visual Studio is not a 'real' web server in that I don't believe it is accessible thru the network.

I'm kind of surprised that you don't have a web server up and running to test things on.  I have 8 of them running in this room.  Make that 9, I have two of them on one computer.  3 IIS, 6 Apache on Windows, Linux, and Mac OS X.

Firefox Error Console - Ctl-Shift-J - all Tools like that are the Tools -> Web Developer menu flyout.  On my Firefox, that is just above the Web Developer Extension on the tools menu.
0
 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 39195843
Hi Dave,

Here is what I think I should have. It is not working yet though:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html>

<html>
<head>
	<title>Smart Ajax Links</title>
	<link rel="stylesheet" rev="stylesheet" href="script.css" />
    <script src="script.js" type="text/javascript"></script>
</head>
<body>
<h2>A Gentle Introduction to JavaScript</h2>
    <form id="form1" runat="server">

    <asp:ScriptManager ID="MainScriptManager" runat="server">
    </asp:ScriptManager>    

    <asp:UpdatePanel ID="hellowWorldUpdatePanel" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <ul>
                <li><asp:HyperLink ID="HyperLink5" href="jsintro/2000-08.html" runat="server">August article</asp:HyperLink></li>
                <li><asp:HyperLink ID="HyperLink6" href="jsintro/2000-09.html" runat="server">August article</asp:HyperLink></li>
                <li><asp:HyperLink ID="HyperLink7" href="jsintro/2000-10.html" runat="server">August article</asp:HyperLink></li>
                <li><asp:HyperLink ID="HyperLink8" href="jsintro/2000-11.html" runat="server">August article</asp:HyperLink></li>
            </ul>
            <div id="previewWin"> </div>    
        </ContentTemplate>
    </asp:UpdatePanel>

    </form>
</body>
</html>

Open in new window

0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 39195851
I don't agree.  You do not need any of that asp: stuff.  It contributes Nothing to a simple page like this.  And it does not fix the javascript problem in any way which is your actual problem.
0
 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 39196026
As long as I can make function in vs 2010, I don't have to have any of the js codes. How can I make this function in vs 2010 with or without js?
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 39196066
I have no idea since I don't use VS2010.  I'll say it one last time.  The problem is that your javascript is not working.  The URLs you originally gave work fine because you can click on them and see the pages.

I suggest you click on "Request Attention" and get some others to look at you question.
0
 
LVL 34

Accepted Solution

by:
Mike Eghtebas earned 0 total points
ID: 39197175
Hi Dave, This is what I was looking for. It works:
(without IIS)
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html>

<html>
<head>
	<title>Smart Ajax Links</title>
	<link rel="stylesheet" rev="stylesheet" href="script.css" />
</head>
<body>
<h2>A Gentle Introduction to JavaScript</h2>
    <form id="form1" runat="server">

    <asp:ScriptManager ID="MainScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference path="~/script.js" /> 
        </Scripts>
    </asp:ScriptManager>    

    <asp:UpdatePanel ID="hellowWorldUpdatePanel" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <ul>
                <li><asp:HyperLink ID="HyperLink5" href="jsintro/2000-08.html" runat="server">August article</asp:HyperLink></li>
                <li><asp:HyperLink ID="HyperLink6" href="jsintro/2000-09.html" runat="server">August article</asp:HyperLink></li>
                <li><asp:HyperLink ID="HyperLink7" href="jsintro/2000-10.html" runat="server">August article</asp:HyperLink></li>
                <li><asp:HyperLink ID="HyperLink8" href="jsintro/2000-11.html" runat="server">August article</asp:HyperLink></li>
            </ul>
            <div id="previewWin"> </div>    
        </ContentTemplate>
    </asp:UpdatePanel>

    </form>
</body>
</html>

Open in new window


and:
window.onload = initAll;
var xhr = false;
var xPos, yPos;

function initAll() {
    var allLinks = document.getElementsByTagName("a");

    for (var i = 0; i < allLinks.length; i++) {
        allLinks[i].onmouseover = showPreview;
    }
}

function showPreview(evt) {
    if (evt) {
        var url = evt.target;
    }
    else {
        evt = window.event;
        var url = evt.srcElement;
    }
    xPos = evt.clientX;
    yPos = evt.clientY;

    if (window.XMLHttpRequest) {
        xhr = new XMLHttpRequest();
    }
    else {
        if (window.ActiveXObject) {
            try {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e) { }
        }
    }

    if (xhr) {
        xhr.onreadystatechange = showContents;
        xhr.open("GET", url, true);
        xhr.send(null);
    }
    else {
        alert("Sorry, but I couldn't create an XMLHttpRequest");
    }
    return false;
}

function showContents() {
    if (xhr.readyState == 4) {
        if (xhr.status == 200) {
            var outMsg = xhr.responseText;
        }
        else {
            var outMsg = "There was a problem with the request " + xhr.status;
        }

        var prevWin = document.getElementById("previewWin");
        prevWin.innerHTML = outMsg;
        prevWin.style.top = parseInt(yPos) + 2 + "px";
        prevWin.style.left = parseInt(xPos) + 2 + "px";
        prevWin.style.visibility = "visible";
        prevWin.onmouseout = function () {
            document.getElementById("previewWin").style.visibility = "hidden";
        }
    }
}

Open in new window

0
 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 39197179
I tried to pass on 500 points to you but I was not able to. Do you want me to ask this to be reopened?

You made me work hard until I figured it out which is appreciated.

Also, plese add a comment on FireFox issue at: http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28137713.html

so I can close that question.

Thanks,

Mike
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 39197185
No, I don't need the points.  It may work in VS2010 but no websites on the internet run on Visual Studio.  They are all using 'real' web servers like IIS and Apache.  We've had a number of questions where something will work in Visual Studio but cause a lot of problems when it's put on a real web server.  Until you test it on IIS, I would not consider you to be done with this.
0
 
LVL 34

Author Closing Comment

by:Mike Eghtebas
ID: 39207107
This solution works.
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

650 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question