Filtering ajax content with jscroll - jquery-jscroll

I am using bootstrap filters and I load the whole ajax response to a div.It contains the link to the next page for jscroll.However its not working it does not load.When I first enter my page it works perfectly.

My solution after the Ajax has finished set jscroll data tou null, $(container). data('jscroll', null) it should work perfectly. After that you call jscroll again with your parameters.

Related

X-Editable - Not showing edit box from ajax response hrefs from modal

I have a page when you click a button, it opens a Bootrstap 3 modal. This modal's function loads an Ajax call and returns a HTML on a DIV. This HTML has the fields to be used in x-editable. I declared all fields before:
$(document).ready(function() {
$('#Make').editable();
$('#Address').editable();
...
});
The Ajax response have all fields previously defined, but don't open the edit box.
Used console log with no errors. Seems it's not calling the function.
Thanks
solved my own problem. The element name has space on it. Removed and worked fine.

browser stuck on ajax request

i developed a simple web site which uses ajax to load content and while the content is loading, i'm displaying a progress. Everything works as expected on 1st ajax call but after that, it becomes a mess
page gets stuck on ajax call
i've written a function to listen to ajax call and show loading message, it doesn't work too and the page becomes very laggy and slow after the 1st ajax call.
Here is my ajax function.
function loadPage(path) {
$.ajax({
type: "POST",
context: document.body,
dataType: "html",
timeout: 10000,
url: path
});}
i tried to async to true but its true by default. still it didn't help. a demo of the problem can be seen at : REMOVED SINCE PROBLEM SOLVED
This works perfectly fine on the localhost but as soon as i uploaded it to my remote server,problems started to occur. can an expert please be kind point out what have i done wrong ? i tried removing all little the animations from this, non helped.
the problem was me loading javascript files on each ajax cal causing too many get and post requests and unnecessary dom changes.
your page seems to be slow with every click, because you are constantly loading JavaScript files on every click instead of just loaded the JavaScript once when the page loads, since you are grabbing the whole HTML page
like for instance.. every time you click on HOME .. these files are loaded in the page again..
POST http://3rsmj.com/new/home.html
GET http://3rsmj.com/new/js/liquid/jquery.easing.1.3.js?_=1382114556389
GET http://3rsmj.com/new/js/liquid/jquery.touchSwipe.min.js?_=1382114556390
GET http://3rsmj.com/new/js/liquid/jquery.liquid-slider-custom.min.js?_=1382114556391
if using AJAX its best to just load the content in or in fragments so not having to load all the scripts on every menu click .. or load the data and populate the data in the content
have you tried looking into the jQuery load() method for loading in HTML fragments so to not have to load in the whole HTML DOM again
http://api.jquery.com/load/
like this:
$("#load_area").load("portfolio_item.html #ID_of_content_to_grab");
the above would go to portfolio_item.html and grab the html fragment from the id #ID_of_content_to_grab and insert it into #load_area
UPDATE:
you can also try to empty the #load_area before you insert new content
$("#load_area").html("");
$("#load_area").load("portfolio_item.html #ID_of_content_to_grab");
or you can use jquery empty() .. or test both out
..

How to get the raw markup from a jquery mobile pageload request?

How can you get the raw HTML markup from an AJAX request that loads a page in jquery mobile?
My page has a menu outside of the page container element (data-role="page") and I need to update it on each page load but jquery-mobile only gives me the page markup from the request not the entire document.
I've even tried using the global ajaxSuccess callback for jquery; apparently jquery-mobile feels the need to filter this to just the page element also.
Can't you just assign an id to the menu page and access it directly?
$('#myMenu').html(newContent);
Found the http request object in the pageload event.
$(document).bind("pageload", function (e, data) {
console.log(data.xhr.responseText);
});

RedirectToAction MVC 3 after $.ajax call

From my view I am sending via $.ajax a JSON object to my controller to save it in the database.
If all succeeded i want to redirect to another action which will show a diferent view.
If i use this code:
return RedirectToAction("CreatePage", "Survey", new {id = question.PageId});
The execution goes to the Survey controller which returns a view but it is not shown.
I have read some post which said that it is not posible to redirect via ajax.
The solution I use so far is to redirect via javascript like this:
success: function (ret) {
window.location.href = "/Survey/CreatePage/" + $("#PageId").val();
}
Although this always works, sometimes i need to refresh the CreatePage view to show the last changes made.
Any idea of how to solve this problem better?
Thanks in advance
As mccow002 suggested, I wasn't really needing to make the call via AJAX for that part. After studying the solutions suggested, i realized that i could simple submit it in a form. My confusion came because I have a save and continue editing and a save. For the save and continue I use the AJAX call, but for the save option with the form being submitted is ok.
Thanks very much for your help.
Instead of redirecting to a new page, you can send a rendered html from .net code back to client and load that html in page, like this $("#main").load(renderedHtml).
But for refreshing the page you can write a simple script that run at specified intervals and refresh the page contens.
You could use [OutputCache] on the CreatePage action so that it doesn't cache the page or only caches for so long.
output caching

Go - How to load a new html form

After processing a jQuery Ajax Post from an HTML form successfully within a Go program, how do I load a new form? I first tried sending the form as the response and the Javascript displayed it, but it did not clear the old (existing) form. I then tried within the HTML Javascript to set the URL using "window.location = 'localhost:8088/MaintForm/'". That resulted in a warning from the browser but did not load the form and did not change the URL. I would like to ideally know both methods - via the Go program acting as a server, and via Javascript. If I manually change the URL, the form loads OK. What I am trying to do is receive a response in Javascript (jQuery Ajax), and then request the new form if the response is positive. I would prefer to do this without changing the URL. As I said above, this partially worked.
You would have to put your original form inside a tag, for example a div, and use your JQuery code to replace the contents of that tag with the new form. This way you are not changing the URL.
This is more of a javascript/JQuery question than a go-specific one.
In javascript:
location.href = '/MaintForm/';
In golang, you can use the http.Redirect function, like this:
http.Redirect(w, r, "/MaintForm/", http.StatusFound)
Please note: this appears to be solved by : I just need to do an "document.write(data);" in Javascript. "Data" contains the new HTML.

Resources