How do I get data from the database, without refreshing the page?
I dont even know where to start...
In Rails you will need to implement a page that pulls data from the DB and shows the data in whatever format you prefer, plaintext/json/xml. There's no asynchronous stuff in this part.
Ajax will be happening in frontend, the javascript part, that asynchronous connects to the webpage that you made above. jQuery's $.ajax will save you a lot of time.
You'll need to make your AJAX call from either an onload.js or a page specific js file (example.js). You'll then need to run a $.get or $.post call to the URL of the data.
Here is a pretty detailed tutorial: http://www.tutorialspoint.com/ruby-on-rails/rails-and-ajax.htm
Related
In Laravel when we using forms to store or delete a resource, the page is refreshed. What is the best technology to avoid refreshing the page while the request is being processed? AJAX, Vue.js, etc?
There are two main ways to handle http requests: synchronously and asynchronously.
Laravel is a PHP framework and therefore uses... PHP, which is a synchronous language. This implies a page refresh for every requests you make. The point is, every PHP framework have this behavior, this is the way PHP works.
So let's answer your question: indeed, you need an asynchronous technology to make a request to the server and get the response without refreshing the page. The technolodgy of choice in this case is Javascript, which will be able to make AJAX calls.
An AJAX (asynchronous JavaScript and XML) will, as stated in its name, make an asynchronous request. But an AJAX request is just the way of doing it, it's not really a technology. Yes, javascript frameworks like Vue.js are using AJAX, but that is overkill to just make some AJAX requests.
Using Axios or even jQuery is much easier and will allow you to make a request, grab the answer and modify your page without refresh very quickly :)
[EDIT]
The process to achieve what you are looking for is pretty simple:
Use Axios or jQuery to make an AJAX call (an asynchronous request)
Handle this request with Laravel, as you do for every other request
Returns something (or not, it depends of you) to alert your user that something happened
This response will be handled by Javascript
Vue is suitable for small projects where you just want to add a little bit of reactivity, submit a form with AJAX, show the user a modal, display the value of an input as the user is typing, or many other similarly straightforward things. It's scalable and also fantastic for huge project.
Is there a way in web2py for SQLFRORM.grid pagination to not refresh the whole page without the use of the LOAD function?
In general, refreshing something on the page with data from the server without reloading the whole page will require an Ajax call (or websockets, or an iframe). The easiest way to do that in web2py is probably to use the LOAD() helper, though you could set up the Ajax manually as well.
Greeting to the community. This is my very first question.
I had in mind to add Livezilla live support in my MVC website, but I realised that there are some problems.
First of all, it is written in php and mysql, so is it possible to comply with MVC and sql server?
Does anybody know a similar solution (like livezilla) in my case?
PS. Excuse my poor english...
you could even look into using an iFrame to run livezilla inside of an mvc3 page if you wanted.
or, you could roll your own. if you wanted to try implementing a live response mvc3 page look into jquery and ajax asynchronous calls such as $.post and also look into the extension for controller AsyncController, and [AsyncTimeout(XXX)]. you will also have to read up on sending and receiving json objects in ajax and from a controller to the view.
Simple psuedo:
View:
setTimeOut calls a javascript function every X milliseconds
the javascript function uses json to wrap page data and pass it to the controller inside a $.post() call
Controller:
recieves page data as an model object in a post
determines if page is out of sync or not
returns relevant sync data in a json object back to the view
View:
the same javascript function receives the json object from controller
updates the page based on relevant sync data
Problem solved. I just uploaded the folder given from livezilla in the root folder of my website. Then the only need to met is to have a Mysql server to create the database for livezilla. After that php and mvc runs together with no problem.
Can I refresh the whole page after making ajax calls. kindly check my code on this link for details. Actually I am saving on different server and I am making calls from different url and to see the changes refreshing the page is a must. Kindly let me know if you need more details.
problem in refreshing the page after making two ajax calls
Thanks
No point in using AJAX if you are just going to refresh instantly after. Might as well just POST and let it do the refresh there. I realize this is what was said on the other thread but it's because it makes sense. For whatever reason though, if you still want to refresh, try using the jQuery AJAX call and in your success function just do window.location.reload(), that should work.
check out my answer
problem in refreshing the page after making two ajax calls
I read some paragraphs in a book saying that it is not possible to do a partial postback for web, even AJAX is employed. Ajax will postback everything and update only ajaxfied controls.
However, on pages I made using ajax, I used Fiddler to monitor the transportation. I found when the page initial load, it loaded everything include pictures .... However, when I click a button and do a ajax postback. I can only see the some data were loaded.... Looks like it doesn't need to reload the whole page again.
I don't know if what I see is correct? Or the book I read is correct?
Thank you guys.
That depends what you put in the term "postback".
The AJAX call will send the complete form data back to the server, just as if the form was posted normally. The server will answer with a partial response that only contains the parts of the page that should be updated.
So, the request is not partial, but the response is.
I am not sure how you are posting back from the client side. I am guessing you are using UpdatePanels. How well you 'AJAX-ify' a web page depends on what method you employ.
UpdatePanels - Read Dave Ward's posting on them - http://encosia.com/2007/07/11/why-aspnet-ajax-updatepanels-are-dangerous/
PageMethods to post back to a web service, get the data and update the DOM to display the result
JQuery and other such AJAX frameworks to post back to a web service
I am sure the link above should clear things up a bit
I'm having a hard time understanding your terminology. I'm not really sure what a "postback" is, much less a "partial" one. I do know that one of the basic ways to transmit information to an HTTP server is via a POST request, which is usually used when submitting forms. If you mean to say that the entire form is transmitted when you click a submit button, I believe you'd be right.
You also seem to be doing something with AJAX, but it's difficult to tell. The whole point of AJAX is to have dynamic data displayed on a page without resorting to reloading it. Defining what to send and what to do with the results is entirely up to your own JavaScript. So unless you're using a framework, which you don't specify, there is no such thing as "ajaxified controls."
In any case, "AJAX" usually means using the XMLHttpRequest() method of modern browsers to send data to servers without refreshing the page. When you call this function, you specify exactly what data to send. This has nothing to do with HTML forms. One caveat: if you are indeed using a library for AJAX, it might impose additional limits on how you structure information to send.