I'm working on a web-based game with HTML, CSS & JavaScript, using Visual Studio. I'm using TaffyDB as a database. However, whenever I try to create a database using the function TAFFY, an error shows up on the console, saying that TAFFY isn't a function. I'm not sure where the mistake is, I believe I've linked the JS files to the HTML correctly, here are all the ways I've tried:
<script type="text/javascript" src="/taffy-min.js"></script>
<script type="text/javascript" src="./taffy-min.js"></script>
<script type="text/javascript" src="taffy-min.js"></script>
<script type="text/javascript" src="https://github.com/typicaljoe/taffydb/blob/master/taffy.js"
I have also tried including the full path, and for all of the above I tried it using 'taffy.js' instead of 'taffy-min.js'. I have also tried it with and without jQuery:
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>
I am not sure if the mistake is the JS files not linking to the HTML properly, or if it's something entirely different. Code I used to set up a user:
var users = TAFFY([
{
"id": 1,
"user": "John123",
"level": 5,
"gameType: "easy"
}]);
First of all you have missing double quotes here: "gameType: "easy", should be "gameType": "easy". The error is saying that TAFFY is not a function: this means that there's another variable in the scope named TAFFY.
In order to check if the taffy script is linked correctly open the console and type typeof this.TAFFY which should print "function". Hope this helps.
Related
I'm very new to JavaScript (just started a few hours ago and trying to get a script working). I went through a few tutorials on W3 and the 'hello world' code works when I paste it directly into my HTML but I'm having a problem with a script (I've had problems with other scripts as well but I am not sure what I'm doing wrong).
I have this code that I want to test in my HTML, I copied the HTML in and it looks the same then I made a file in my static folder called edit.js and copied the JavaScript into it (exactly as shown). It didn't work no errors on the page but when I click it nothing happens. I tried to paste a W3 'hello world' code in and that worked but this script does not.
I tried to inspect the code in Chrome and that's where I see the above error (under the resources tab). I can open the js file using Chrome which makes me think the js file is accessible and pointing correctly but I'm not sure how to get it working. I'm using Jinja2 as my template engine to render the HTML and in my header I have:
<script language="JavaScript" type="text/javascript" src="static/edit.js"></script>
and in my main template (the one that gets rendered on all pages) I have:
<script language="JavaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
edit.js:
(even putting it within the script tag directly on the page I want to use it on doesn't work)
$('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
$('#savevalue').click(function(e){
var showNew = $('#changevalue').val();
$('#altervalue').hide();
$('#storedvalue').show();
$('#storedvalue span').text(showNew);
});
HTML:
(it's embedded in a larger page)
<head>
<script language="JavaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript" src="static/edit.js"></script>
</head>
... my html code..
<div id="wrapper">
<div id="container">
<div id="storedvalue"><span>Hello</span> [edit]</div>
<div id="altervalue" style="display:none;"><input type="text" name="changevalue" id="changevalue" value="Hello"> [save]</div>
</div>
</div>
I have never been able to successfully run a JavaScript that wasn't on W3 yet. I get the same problem with other scripts even though I see people online saying they work fine for them. Do I need to do anything extra to make this work?
My two questions are:
What am I doing wrong?
Because Javascript seems to just not work when there's a problem, is there a way to get errors or information on what's actually wrong?
I read Uncaught ReferenceError: $ is not defined? and have been trying to figure this out for the last hour and can't see my problem.
First you need to place the jQuery script tag first.
Second, you need to do one of the following things:
Put your code within this function:
$(document).ready(function(){/*CODE HERE*/});
Or like this:
$(function(){
/*CODE HERE*/
});
The DOM needs to be ready before you can use it. Placing your code within anonymous functions that are executed on the ready event of the DOM is how you can do this.
Edit:
$(function(){
$('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
$('#savevalue').click(function(e){
var showNew = $('#changevalue').val();
$('#altervalue').hide();
$('#storedvalue').show();
$('#storedvalue span').text(showNew);
});
});
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
Script tag for jQuery should come before your custom javascript.
Follow by edit.js
<script type="text/javascript" src="static/edit.js"></script>
Try removing the language attribute..sometimes work for me. It's obsolete now .. i think
You need to include jquery before you can use it.
I'am using a Twitter Bootstraper in my WebAplication, in my materpage i do the following
<%--Referencing jQuery--%>
<script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
<%--Referencing the bootstraper script--%>
<script src="http://twitter.github.com/bootstrap/1.4.0/bootstrap-twipsy.js" type="text/javascript"></script>
<%--My Script--%>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$("a").twipsy();
});
</script>
then in page (Default.aspx) code ia have a single link like this:
text
When a run the page the twipsy (a stylized tooltip) doesnt work.
Look here to see twipsy in action (http://twitter.github.com/bootstrap/javascript.html#twipsy)
I see the "normal tooltip"
Inspecting the console of chrome i see the follong script error
Uncaught TypeError: Cannot convert null to object (bootstrap-twipsy.js:315)
Whats wrong?
Your JQuery version is too old, that might be why.
Another possibility is that your selector is $("a") instead of an id, $("#mylink"). The docs suggest that it should work with a collection, though.
I have a program that allows a user to enter a zip code to generate a google map. I want to make sure that the zip code is valid. To do so I am using the jquery validate method. Here is how my code looks:
$('#zipInput').validator({
format: 'zipUS',
invalidEmpty: true,
correct: function () {
//Code for correct
},
error: function() {
//Error code here
}
});
The problem is that this is not working for me. I get the error $('#zipInput').validator if not a function. I have been looking for examples of the validate method online and I used this link to build my code. I have added jquery.validate.js to my web page as well (issue with incorrect sources maybe?) Any suggestions or examples that I could look at to help figure out my issue?
EDIT: Here is all of the scripts I use in order:
<script src="jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="jquery-ui-1.8.11.custom.min.js" type="text/javascript"></script>
<script type="text/javascript" src="jquery.jscrollpane.min.js"></script>
<script src="mwheelIntent.js" type="text/javascript"></script>
<script src="jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="Default.js" type="text/javascript"></script>
You need to do at least two things:
Load jQuery itself before the plugin.
Enclose your code in a jQuery.ready() construct.
If you are already doing so, please post all the relevant code.
You have to put a call to the validator code you've written inside the function which you are using to call the dialog. This is if the validator code is in the dialog which you are loading.
Another idea is to put the validator code inside the jquery.ready function in the form from which you load the dialog, but this will add some redundant code to that page.
I am working on ASP.NET 3.5, c#, visual studio 2010. I have made a master file and a default page that uses this master file. I have placed a couple asp:contentplaceholders in the master and corresponding code in the page that uses this master. I have also inserted JavaScript like this in the content page (and not the master):
<asp:Content ID="Content6" ContentPlaceHolderID="Mainpage" Runat="Server">
<script src="path1" type="text/javascript"></script>
<script src="path2" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
var options = {
//some java code
};
$(".mycssclass").effect(options);
});
</script>
</asp:Content>
On running the website I get the following runtime error in visual studio:
Microsoft JScript runtime error: 'this.node' is null or not an object
and it point to some function inside the JavaScript like
this.node.onload=function(){..............//I am not a java guy so do not know much about this
Where am I going wrong? Why does the site compile correctly but throw this runtime error?
I also tried inserting this java code inside the master file in the <head>, but same error. This is urgent please so if someone experienced can pinpoint where exactly to put the code that would be solve my problem quickly.
Have you included a reference to the jQuery library? A good practice would be to have the jQuery include in the Master.
<head>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<!-- the remainder of your .js references should follow-->
</head>
If it's your intention to have that script run on 'page load', then ensure you have it set correctly:
$(document).ready(function() {
// put all your jQuery goodness in here.
});
More info on jQuery document ready.
I'm not sure exactly what it is you are doing with that snippet of code, but I don't think it is the proper syntax.
You probably should re-write it to look like this:
$(document).ready(
function () {
var options = {
//some java code
};
$(".mycssclass").effect(options);
});
Just passing in the function to the jQuery selector will probably get some wonkiness.
Thank you everyone! there was no problem with either the syntax in the javascript or the location/page where it was first included by me. I just figured out that the mistake was somewhere else. This javascript works on an <img> tag. It zooms the image insdie the <img> tag. I was using the <asp:ImageButton> instead og <img>. It works perfect as soon as I replaced it. Thank you all for your time and the knowledge sharing.
Here is my problem - I'm trying to write a self-updating application, but I keep getting an error saying that runtime.air.update.ApplicationUpdaterUI() does not return a constructor.
Here's the relevant section of the code; there are other javascript files being included, but I don't think that any of them would be actively breaking AIR itself.
<html>
<head>
<script type="text/javascript" src="./js/AIRAliases.js"></script>
<script type="text/javascript" src="./js/jquery-1.3.1.js"></script>
<script src="ApplicationUpdater_UI.swf" type="application/x-shockwave-flash"></script>
<script>
$(document).ready( function() {
var appUpdater = new runtime.air.update.ApplicationUpdaterUI(); // line 64 in this example
}
</script>
</head>
<body> ... stuff ... </body>
</html>
And the error that I get when I test it is
TypeError: Value is not a constructor. Cannot be used with new.
at app:/index3.html : 64
at app:/js/jquery-1.3.1.js : 2912
at app:/js/jquery-1.3.1.js : 686
at app:/js/jquery-1.3.1.js : 2916
at app:/js/jquery-1.3.1.js : 2936
Verify the path in that script tag for the SWF, I'm guessing you do not have the reference to the ApplicationUpdater_UI.swf correct.
Air is basically complaining that it cannot find a runtime.air.update.ApplicationUpdaterUI() method to call anywhere, which likely means it can't find the SWF (or I suppose it's possible the SWF is corrupted).
Not sure if this is related, but neither $(document).ready nor .load will work if you load the .swf before the script. Make sure you put the .swf reference at the very bottom of your page.