Is there a way in django to update the same page with the response without totally rendering it. I am trying to create a code editor to test. But when I am returning the results my contents are removed. I understand it is because I am rendering the page . I need the contents to retain. How can I do it using redirect? I am including the render statement I used and a screenshot of how it looks here:
Steps:
Handle post request
Program execution code
Save the result in a variable called "message". Then I used
return render(request, 'editor.html', {'message': message})
I want to redirect the message to the same page without rendering a new page.
[Before submission][1]
[After submission][2]
[1]: https://i.stack.imgur.com/BxoLU.png
[2]: https://i.stack.imgur.com/uiEOU.png
Any help will be appreciated. Thank you.
it is possible. using ajax in front-end and render or render_to_string in back-end(Django). using ajax you're able to call a url (with/without data you want to send), then in the views.py you can do anything needed and return render(request,'template.html, context). then in ajax you have success: function (res) { $('#id_of_element').append(res)}. this function in ajax will append the recived response which is a rendered HTML template to the target element.
For that, you have to switch to a different web software paradigm called "single page application", which implies that both, backend and frontend, are functional software components on their own, instead of having a "dumb" HTML frontend that only displays what the backend renders.
In a regular web application, the front end is served from a backend with all the information that is going to display. In a Single Page Application, the front end is served by a server independent of the backend server, and the frontend and backend interact through an API served by the backend.
With this architecture, the frontend component is responsible for requesting and providing data from and to the backend, as well as for displaying the data and getting user's interaction, and the mean for interchanging data with the backend is called an ajax, that is an asynchronous request.
The only language accepted by web browsers is javascript, but there are many frameworks and second level languages that can render a javascript application, like React, Angular, Vue, and many others.
Related
So I just created a website's front-end using ReactJS. Now all I need is a backend database that I will fetch data from using requests.
The question is whether I need to render templates using my backend or just use my server to make requests (eg get, post etc)
PS. I will be using Django as my backend.
Thank you everyone who will help me out.
Doing both is recommended. Based on the requirements and use cases we must use both ways to render.
For example, Some products use initial html as a Server side rendered page with all essential data required inserted as scripts and so on. This helps in loading primary content faster. If we are not following this in applications that require data initially. Then it might take more time to fetch React chunks, scripting and after seeing an API makes request, and then getting data and then displaying the primary content. So when a page needs more data (like More API calls) then server side rendering might be a good way.
For other scenarios like getting user details, All these can be done using React.
No, because you will use DRF (Django Rest Framework) to communicate between frontend and backend. Basically you will write your own APIs in the views.py that will respond with JSON data, at least in major of cases this will be enough. So, you don't need templates, since template are really Djangos' frontend, that you will not be using at all.
But, this heavily depends on what you are doing and what is your setup.
I am new to web development, recenlty I am learning to build a webserver using django + ExtJs. but I am confusing about how to use django + ExtJS together.
For django, it has template to display the data, the parameter passing to html files could be dict, and could send JSON. I am trying to use it as the backend of the webserver.
ExtJS, support JSON.
Then here comes myquestion:
How to make .html files( used by django as the template layer) to accept "JSON"? It seems that ExtJS has no ability of sending json data through socket or other IPC.
It seems that ExtJS has the ability to use AJAX to "post" the data to backend, however, I am not sure how the .html could get data from backend using JSON? I downloaded ExtJS the 4.2.1 version, and find some examples in the files, however, it only give some example to get data from "json files".
Can someone give me an example or show me which aspect I should learn or explain its mechanism briefly?
This is done not at template layer, but at view level. You should write a view function in Python and assign it to some URL address. In that view function, you can access JSON data sent by ExtJS and process it how you wish.
I totally misread your question, here's the updated answer:
On Django side, you should write a view function, which would return JSON response, and assign that view to some URL address. (See How to write a view in Django documentation, if you're new to this.)
On ExtJS side, you should make an Ajax request to that URL, and provide success callback function that will be able to access the output of Django view function. (Seems like Ajax requests in ExtJS are usually done using Ext.Ajax.request.)
We currently have a large implementation done in Django which mostly spit out static HTML. We are planning to implement a javascript modular framework to hook to django's API and define needed routes..etc
But, we do not want to scratch off what we did so far as the site is completely functional for non-js users. The more I read about JavaScript MVC designs, the more I find it impossible to implement the two to work together.
Any ideas of how to proceed in that direction? is there a best practice that someone can follow?
Keep what you got right now as a fail-safe. Create new, separate views meant for Ajax requests that handle the processing of data and respond with appropriately formatted respond data (XML, JSON etc.).
Basically, Django is your model. Any action defined by your Javascript controller can either modify the model or the view.
If it modifies the view, there are two options: you either change just the display of data, and thus you just call a Javascript function that alters the HTML, or you display new data. In that case, you have to create a Django view that supplies that data in a format that Javascript can process easily. In your Ajax request, supply a callback (the view part of your Javascript) that handles displaying that data.
If the action modifies the model, you also need to create a Django view that processes the POST data sent by the Ajax request as needed, and returns either the error messages or a success message in a format that is, again, easily processed by Javascript. Again, you should register a callback to your Ajax request that handles the display of the messages returned by Django.
So basically, the only change to your current views would be that you supply the appropriate Javascript code to map the actions to Ajax requests and to handle the data returned by Django for your Ajax requests. Everything else should be done in separate Django views.
I have a form in a plugin that on submit I need to redirect to another page.
What's the best way to accomplish this?
So possible solutions are:
Use an App-Hook
Throw an exception in your plugin render method that would be caught by a middleware class and do the redirect from there.
Create a middleware class and during the "process_response" method check for a value on the request object that was added during the render method of the plugin then do the redirect.
Plugins are not really suitable for processing POST requests and there's no way to influence the HTTP Response object from a plugin (other than the content of that response).
The reason Plugins have no hook to process POST requests is that a single page is usually composed of several plugins, and figuring out which plugin should handle the POST request would be very hard. For the same reason they can't change the response, since two plugins could try to change the response in an incompatible fashion.
The solution for this is to have a dedicated POST endpoint for your plugins (either static via urlpatterns or via an Apphook). That endpoint would then redirect to another page, or the page the form is on, so the plugin would send some data with it. Alternatively the plugin submits the form via AJAX to that endpoint and redirects/acts in javascript.
I am using the Django template system. What I want is, when I submit a form, or click to an url link, page does not refreshes, but loads with the data returning from the server. Is it possible?
I recommend a combination of jQuery (easy, powerful, popular javascript library) and dajax/dajaxice (http://www.dajaxproject.com/). Dajax is very easy to set up and use, and jQuery is also easy to set up and use. Dajax is strictly for AJAX communications through Django. jQuery is perfect for taking a simple site and making it more fluid, intuitive, and user-friendly.
You need JavaScript to do that. What you are looking for is called AJAX (Asynchronous JavaScript and XML). Essentially, it means you use JavaScript to send a request to the server as soon as the link/button is clicked. The server returns some data to your Script, which then can be used to manipulate the HTML page, e.g. by inserting the responded data into the DOM. Since you do everything with JavaScript, no reloading of the whole page is required.
To start, read the AJAX tutorial. There are certain JavaScript libraries that make these things more simple for you (e.g. jQuery), but you really should understand how this stuff works first, since else you might get into trubble while trying to debug it.