In a project we are using teleriks RadAjaxManagerProxy to send AJAX requests and I was delegated the easy task to implement a scroll-to-top-of-the-screen behaviour through javascript after an AJAX call. This was not at all as easy as expected.
Among other things, I have tried placing my javascript function directly on the page, I have worked with RadAjaxManager.ResponseScript and I have tested with jquery AJAX functions but still no progress. Does anybody have a good clue how to solve it?
This is my latest attempt and I did actually make it work if putting an alert into the code, like this:
ScriptManager.RegisterStartupScript(Page, typeof(Page), "ScrollToTop", "alert('hello');", true);
But whenever I try to insert javascript code like window.location = '#'; or window.scrollTo(0,0); it nevertheless doesn't scroll to top. What am I missing?
ScriptManager.RegisterStartupScript is used only together with UpdatePanels, which I didn't use on my page. Instead I found a solution based on getting the actual RadAjaxManagerProxy for the page. This was done by using the function GetCurrent() on the MasterPage's RadAjaxManager. Hopefully this will save some hours for anyone else with the same problem! My solution:
RadAjaxManager.GetCurrent(Page).ResponseScripts.Add("window.scrollTo(0, 0);");
Related
I've spent an extremely long time trying to figure out why .load in jQuery works really weirdly for me. I have no idea what causes it not to work correctly sometimes.
I am building an UI where the user doesn't have to reload, but instead, whenever they click an <a> link, it calls a JS function that loads the url's contents into a "contentLoad" div.
I'm learning coding myself and jQuery & JS is pretty confusing to me, so I try to keep it as simple as possible.
Situation: I am using a simple JS function that takes an URL (from local FTP server), checks whether the URL has any parameters (example.php?abc=...), inserts "?included=1" behind the URL (to prevent it to be opened unless called by this function) and puts the file's contents into an empty DIV using .load (and also uses .load to display a loading page).
Problem is, it works perfectly, but every two minutes or so, it gets stuck on my loading screen and I have to either run the function again or reload the whole thing. I have no idea what's wrong.
Function:
var loadPage = function(url) {
$("#contentLoad").load("loading.php");
if(url.indexOf("?")>=0){
$("#contentLoad").load(url + "&included=1");
}
else {
$("#contentLoad").load(url + "?included=1");
}
window.history.replaceState('Object', 'Title', url);
}
Then, when I want to have an <a> that opens the page "explore.php", for example, I use
<li>Explore</li>.
What can I be doing wrong?
Alright so, I don't really know how this worked but I suppose the two .loads sort of "blocked each other out", because now that I removed the .load of the loading page, it works... Wow, haha.
So my solution was just replacing the
$("#contentLoad").load("loading.php");
with
document.getElementById("contentLoad").innerHTML = 'loading...';
Thanks to you guys for the help, though! :)
I might be tired but I just can't figure out what the problem is. What I'm trying to do is open a link in a popup window. I got this code below working before but I removed it.
About
However, it stopped working now when I put it back. I even got it working on jsFiddle so I'm at lost on what to do. I'm assuming something must be blocking it from running?
The code is short and simple so I figured someone here might have an idea what could cause this.
EDIT: Sorry I should have thought of it. I guess I should sleep. Anyway here's a demo-website where I reproduced the problem http://testmycode.tumblr.com/ The problem is the "About" link, pressing it returns nothing.
OK, it seems like somewhere in your code you have changed the window variable to a custom function. When you try to call window.open (more specifically, document.window.open), the method open simply doesn't exist in the function window, which causes it to throw an error.
Check this out:
You somewhere changed it to a function by doing document.window = ....
It's MooTools 1.2.4 which changed it:
To fix it, simply using an EventListener and problem solved! (Inline codes are bad practice anyway.)
<a class="about">About</a>
$(".about")attr("href", "#").click(function(e){
window.open(...);
e.preventDefault();
});
The snippet you shared works when I append it to the page we are at, in Google Chrome. Which makes me wonder which browser you are having the trouble in. So I would encourage you to try the snippet you shared in Google Chrome, and if it works there then you will know it is a browser specific kind of bug, in which case I would try adding a semicolon after return false.
I am working on a crm adding some features. One of them was to use ajax to post to another page a use the returned information to fill out some forms. It worked great. I am using $.post and all that good stuff. I then noticed that one of the other prewritten features of the site stopped working. So I started poking around and the feature that stopped working was giving this error in the console log.
[19:15:21.013] TypeError: $("view_Option").selectedIndex is undefined # http://test.com/crm/modules/Calendar/script.js:598
So ok I figured I was linking to jquery twice or something along those lines so I commented out that line and it works. So I check my code to make sure that works too and now I get
[19:13:40.312] TypeError: $.post is not a function # http://test.com/crm/modules/Calendar/renterAutoUpdate.js:16
Can someone explain to me the reason this is happening and how I would go about fixing something like this?
[Edit] The line that determines whether my code or the prewritten code is going to work is
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
Probably you've commented out the line, that was used elsewhere in your project. Try uncommenting it again and see what happens. The $.post is not a function should gone, and you should get back your first error.
If it happens, you have to fight back the first error, which is probably that jQuery doesnt have the .selectedIndex. Instead, you should write:
$("view_Option")[0].selectedIndex
Try this, and write, what happens.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script>
var $jq = jQuery.noConflict();
</script>
And then I did
$jq.post(
instead of
$.post(
Fixed all my issues for anyone else having this same problem
I am wondering if I can have the unload method in Javascript do a button.click; or a document.getElementById('target').click();
The reason for this is I want to clear the information in the browser but I can't seem to get the unload method to work right. But I don't even know if the unload method is capable of doing a button.click or a document.getElementById('target').click(); Is there like a list of things this method can or cannot do? here is the code I am trying to get working.
window.onunload=leave;
function leave() {
//alert("Leaving");
document.getElementById('kioskform:broswerCloseSubmit').click();
}
The alert seems to be showing in everything ("IE, FireFox,Safari") but in Chrome ('don't know why) but i can't seem to get the clear options i am using to work with the unload method. Not to mention I am wondering if there is a good way to detect which browser the individual is using to load in different parts of the unload script any idea's or suggestions or advice is greatly appreciated.
If you were to use jQuery , you could use the DirtyForm plugin. This would accomplish what you are trying to do.
I have a system that loads a div with content through the use of AJAX. All is well, I can get the div to load perfectly with details from my database and it works great.
The problem is this:
Inside the returned div, I have a couple of buttons with onClick events. The onClick events cause an error when I attempt to call a user defined function onClick="my_function();" but the onClick events do not cause an error when I call a JS defined function onClick="alert('success');".
Anyone know why this would be? my_function() is defined in the head of my page. Although, I have also tried to define it in the content returned by AJAX, still with no luck.
Any help will be greatly appreciated
if you are using prototype, jquery, etc.. (any JS framework), you need to be sure you have set the param "evalJS" to true. this last example I put works in prototype.
check here for prototype
You could try adding event handlers via JavaScript instead of onclick handlers on the actual elements.
Then you could use anonymous functions.
If you're simply updating the innerHTML of a DIV element with the result of an AJAX request, keep in mind that the browser parses only HTML not scripts.
Probably that's why you're recieving the JavaScript Error.
To parse also the scripts you need to consult the documentation of your library. For instance, if you're using ASP.NET you can call ScriptManager.RegisterClientScriptBlock in order to instruct the AJAX client componenet to parse the scripts in the result.
On the other hand, if you're doing it by hand (one thing I did awhile back), you need to detect and parse the scripts yourself.
OK, here is the simple answer.. I had the button element name and id as the same as the function which it was trying to call.. stupid mistake I know.. anyhow, it is now working.. however, I do have another problem.. my ajax only fires once.. it works great the first time, but after that the function doesn't work
here is my code:
function delete_account(account_id) {
create_request();
var url = "accounts_ajax.php?action=delete_account&account_id=" + account_id;
show_div('action_window');
document.getElementById('action_window').innerHTML = '<div class="please_wait"><img src="images/working.gif"><br>Loading...</div>';
xmlHttp.open("GET", url, true);
xmlHttp.onreadystatechange = function(){if(xmlHttp.readyState!=4)return;if(xmlHttp.status==200){reload_div('action_window', xmlHttp.responseText);}};
xmlHttp.send(null);
}
it just causes an error second time around.