Is there a way to auto refresh an HTML table inside a DIV tag every few seconds without refreshing the whole page?
There are more than one ways to achieve this. Easiest thing that comes to mind is have a Javascript timer run every few seconds to make an AJAX call to refresh the DIV tag enclosing the table.
Here is some info on Javascript timing functions
http://www.w3schools.com/js/js_timing.asp
You can choose some javascript frameworks thats already use Ajax to do it.
For example Extjs libraty. In this library you will need to invoke method of the store
Related
Im currently building a website with django and htmx and i like the combination so far. Lets say I use an htmx attribute on a button to replace a div in the DOM with another div that is supposed to contain a wysiwyg editor. Now the wysiwyg editor has to be initialized with javascript. How do I do this? Can I just return the script tag under the editor div that is being requested with htmx? Wouldnt that be also a little ugly or bad practice because youd have script tags in the middle of the html body? Whats the best way of solving this?
Thanks in advance
If it's just a single htmx:afterRequest event that you are trying to listen to (or if you have code that should run after all htmx requests) then you can use the below code to run your Javascript code after any successful request is completed:
document.addEventListener('htmx:afterRequest', function() {
// Put the JS code that you want to run here
});
If you want it to run after a specific event only, you need access to the (evt) associated with the event, to which you should refer to the official docs here.
Check out HTMX after request event.
It should look something like this
htmx.on('afterRequest', (evt) => {
// check which element triggered the htmx request. If it's the one you want call the function you need
})
I want to refresh a particular table of a HTML page in Django, but I don't want to use Ajax/jQuery for that.
The data in table comes from database. In my case, Django application with SQLite database. The table need to be refreshed every 1hour.
Is there any way I can achieve this?
If yes, then how?
Ajax/JQuery would be the best way to do this dynamically.
The other option is to actually refresh the page:
<script>
function refresh() {
window.location.reload(true);
}
setTimeout(refresh, 3600000); // 1000ms * 60sec * 60min
</script>
For a Non-Javascript solution, you could use a Meta Refresh header. Place this line in your <head> tag:
<meta http-equiv="refresh" content="3600">
Note that this approach is not really recommended and deprecated by the World Wide Web Consortium. It still works, but browsers might drop support at some point in the future.
I am wondering how one would setup a multi-step form in CFWheels.
Clearly I would need to store form data in the session etc as I go, but I would like to know the best approach from a wheels perspective to do this the 'wheels way'.
Do I have just one action in my controller that handles this? Or would it be best to seperate each part of the form out into separate actions?
Advise on this and possible code examples would be much appreciated.
Thanks,
Michael
The way I've done it in past is use Ajax calls and a jquery modal.
though the jquery modal is not important, I just like the aesthetic. a simple div replacement will also work.
If you cannot be sure that the users can use AJAX then it won't work for you, but you might be able to use a popup window.
The advantage of using Ajax calls for multi-step forms is that you can adjust the form content from one step to another. Another advantage is that you don't have to store user data in the cache or session. Because each time you send a form, you can use the POST or GET.
For this to work, the quickest way of setting this up is to use the plugin called RemoteFormHelpers. Then each step of the form would be a different controller (or the same one with a switch statement based on the data passed)
I think this is a pretty versatile way of doing this, but you cannot do a form that uses file-uploads, well not easily as ajax won't let you do it without some serious pain.
I'm not really experienced with web development especially on views , I need a simple explanation (and pointers to a resource would be really nice as well) on how to deal with rendering a layout or a template partially without rendering whole page again...
What is the best practice?
Does Sitemesh layouts provide this? if so how ?
Shall I use JQuery pass the data as JSON from controller and update the corresponding div with ".html()" ? (which i did something like this a long time ago for some basic stuff, and think this is not really a grails way to do it)
or <g:include> does this for me?
Everything I read about this confused me even more :)
Actually the question is, what is the best practice in Grails to handle partial page updates (with Ajax or without ajax if there is any other ways these days)
Thanks in advance
EDIT:
this tutorial actually gives a really good idea of how to do it
What is the best practice?
The usual practice is to submit an AJAX request (i.e. a HTTP request triggered from JavaScript), and use a JavaScript callback function that updates a section of the page when a response is returned.
Does Sitemesh layouts provide this? if so how ?
When an AJAX request is received on the server-side, you could layout the response using Sitemesh in the same way that you can layout the response of a non-AJAX request. Sitemesh doesn't know or care what kind of request is being processed or whether it's laying out a whole page or just a fragment.
Shall I use JQuery pass the data as JSON from controller and update the corresponding div with ".html()"
Have a look at the tags provided by Grails that have the word "remote" somewhere in the tag name. They provide a very simple way to perform common AJAX tasks within a Grails application. For example, to submit an AJAX request to an action named bookByName and add the response to an element with id foo, simply add the following tag to your page.
<g:remoteFunction action='bookByName' update='foo'/>
Probably you need to use RemoteLink tag: http://grails.org/doc/latest/ref/Tags/remoteLink.html
You can configure it to update some fragment of your page, after calling an remote action.
BTW, it's grails way too, to use ajax and javascript, on client side :)
I have some links on an html page like , , currently I handle them as so
<p> rate down
and have a url.py entry:
(r'^cases/(?P<case_id>\d+)/case_rate/(?P<oper>.)$', 'mysite.cases.views.case_rate'),
then I have a view function that handles the logic and hits the DB, then does this:
return HttpResponseRedirect(request.META.get('HTTP_REFERER','/'))
I's there a better way to do this? I can see how this would be OK because it does have to redraw the screen to show the new rating...
The typical way to handle this is with an ajax request.
Instead of a link, you put a javascript handler that calls a view, wich updates the db, and returns a json / xml object with the new rating for the item. Then another javascript handle receives that response and updates the rating number on the screen, without a page reload.
Ideally, you'll keep both versions: plain html (the one you currently have) and the ajax one. The ajax one can be attach to the element after page load, so if javascript is not available, you'll still have a working site.
Then, regarding organization, you can have an "ajax" parameter on your view. The view should update the db accordingly, and if it's an ajax call, return the json / xml response, otherwise, return the new page. That way you can keep the logic (fetching the object, updating the db) on one place.
If you're asking whether case_rate should still go in the views.py given that it returns a redirect rather than providing content, the answer is yes, since case_rate is handling an request and returning a response.
But consider a situation where you had two view functions in views.py that had some duplicate code, and you chose to factor that duplicate code into another function that didn't both take request and return a response. Would that be fair game to leave in views.py? Sure, if moving it elsewhere would make the code harder to read. Or you might choose to put it elsewhere. It's really your call based on your sense of taste.