In my aspx page:
<script type="text/javascript">
Ext.onReady(function() {
Ext.get('mb1').on('click', function(e) {
Ext.MessageBox.confirm('Confirm', 'Are you sure you want to do that?', showResult);
});
function showResult() {
Ext.example.msg('test');
</script>
<div>
<asp:Button ID="mb1" runat="server" Text="Button" />
</div>
I got error message "ext is undefined". Can anyone help me?
You have to include the js file like
<script type="text/javascript" src="extjs.js"></script>
before using any of the functions.
you should download the extjs framework from the site itself and host it locally if you can. http://extjs.com
Is it possible that you used "ext" somewhere instead of "Ext" (wrong capitalization)?
you don't seem to be closing your functions with "}"
Once you get Ext working, you'll probably want to use the button's client ID instead of the code-behind ID:
...
Ext.get('<%=mb1.ClientID%>').on('click', function(e) {
...
Include below all three file in your file
ext-all.css,ext-base.js,ext-all-debug.js
Related
`
function init() {
var a = 'output of my processing';
alert('I am here'); // alert pops up
document.getElementById("<%=hdnField.ClientID %>").value = a;
}
<head>
<script src="../Scripts/myscripts.js"></script>
</head>
<body onload="init()">
<asp:HiddenField ID="hdnField" runat="server" />
</body>
`I have a page with lot of javascript; I am trying to clean it up by moving the scripts to a script folder and reference the path; Seems to work fine, except when it encounters 'document.getelementbyid(controlname.id)'- it throws 'TypeError: Cannot read property 'value' of null'
I understand it is not able to find the control. Why does that happen? I thought the DOM is already built - what difference does moving the javascript to a path make to that anyway? Any ideas on how to make it work? I would really like javascript to be moved from the page.
You're using ASP.Net inline calls inside your JS. This couldn't work, for two reasons:
It's likely you don't have your server configured to handle .js files using the ASP.Net processor.
Even if you did, the processing of the .js would be completely separate to the hosting .aspx page; meaning hdnField would not be in scope.
You would be better off passing knowledge about the items on your page directly to the JavaScript:
JS:
function init(config) {
var a = 'output of my processing';
alert('I am here'); // alert pops up
document.getElementById(config.hdnFieldID).value = a;
}
ASPX:
<head>
<script src="../Scripts/myscripts.js"></script>
</head>
<body onload="init({ hdnFieldID: '<%= hdnField.ClientID %>' })">
<asp:HiddenField ID="hdnField" runat="server" />
</body>
Hope that helps.
This answer assumes your directory structure is correct.
Move your script tag to the bottom of the body, just before . Here is a good SO answer to this question, and here is another.
In addition, in general, it's bad practice to call a JavaScript function from inside HTML elements. If you're not using jQuery, you can add a "DOMContentLoaded" event listener to run the code. With jQuery, the standard $(document).ready() has been proven to work well. Or, if you simply put your script tag at the bottom of the , and place init(); at the end of your JS file, it will all run properly. This would be for a very simple application, but simplicity is sometimes the best.
Finally, for a sanity check, you could hard-code the ID in your init function. I don't know asp.net, but you might want to check the output of <%=hdnField.ClientID %>. Are you sure you're getting the correct ID?
Good luck.
Here is what I did in my project:
<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
<script type="text/javascript">
alert("before");
//It can not work cause the LIST is in the subsite called "Service"
//var clientContext = SP.ClientContext.get_current();
var context =new SP.ClientContext("http://sp2010dev1:88/Service/");
alert(context );
</script>
</asp:Content>
But, the alert(context) can not execute ,when I check the concole it showed me TypeError: SP.ClientContext is not a constructor,that is to say there was something wrong with the initialization of ClientContext. Why? How can I get ClientContext? Or was it caused by the lacking of SP.js?
My Final Solution is : Add this statement to the masterpage: ,and then everything works good! May this can help you.
Instead of writing directly in the <script> blocks try to insert in the function and call that function on body load.
Another good way is call using the jquery
$(document).ready()(function(){
var context =new SP.ClientContext("http://sp2010dev1:88/Service/");
alert(context );
});
Try this once, even if it is not working then will try to find another solution.
Along with this as per steve suggestion, include first sp.js and perform remaining things.
Yes, it probably is because SP.js is not loaded. Try this:
<SharePoint:ScriptLink runat="server" Name="SP.js" Localizable="false" OnDemand="False" LoadAfterUI="True"></SharePoint:ScriptLink>
<script type="text/javascript">
ExecuteOrDelayUntilScriptLoaded(function () {
/* your code here */;
}, "sp.js");
</script>
I have a script that I want only to load if a certain condition was met, so I figured I should do this:
//Head tag
<script type="text/javascript" id="scriptArea" runat="server"></script>
//Rest of the page
.cs (Page_Load event)
if(someCondition)
{
scriptArea.InnerHtml = "Javascript code";
}
The problem is I get a null pointer exception and when it stops, I discover that scriptArea is null for some reason. Why does this happen and do you know of another solution?
Using asp.net webforms and script runat="server" ends up being server executed code, see MSDN on documentation about this.
If you just want javascript, try this instead:
<script type="text/javascript">
<asp:literal id="scriptArea" runat="server" />
</script>
Then in your code behind
scriptArea.Text = "Javascript code";
I am trying to write my javascript functions in a separate file functions.js. Right now that file consists of one function:
function noOverlay() {
$('.overlay').css('display','none');
};
In my html I have these two lines:
<script type="text/javascript" src="/functions.js"></script>
<script>
$(document).ready(
noOverlay()
);
</script>
Essentially what I am trying to do is house a function in an external file and call it in my html. Maybe $document.ready isn't the right way to do this. Or maybe I am just making a silly mistake. Thanks!
Make sure you are importing jQuery and try:
<script type="text/javascript" src="/functions.js"></script>
<script>
$(function () {
noOverlay();
});
</script>
$(document).ready(function(){
noOverlay();
});
Check to make sure the js file was loaded with firebug or chrome's dev tools
Also make sure you load jQuery beforehand as well.
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.