I'm looking to capture and save the state of a page (Django template + backend) after the user makes some modifications (through JQuery) to the appearance of the page. Now that I've gotten hold of the innerHTML using a JS variable, I need to send it over to the Django view that will do the saving. How do I call this Django view and pass it the JS variable?
P.S: First ever question on stackoverflow, please let me know if the question isn't clear or is improperly formatted.
Handiest way to get started is to first make a proper form and a django view that reacts to it ("request.post"). The form should have fields for whatever you're changing in the page.
Next up, submit that form's variables from your page with jquery.ajax.
So the idea is to isolate the various problems:
What should be the form parameters?
Get a view running that makes the actual changes.
Get the javascript working.
Related
I used to use PHP before and I get why forms are so common because it could literally make you submit a page and request a page from the server through a method that you would choose ( POST / GET ... ) . But when I made a transition to vue. I felt like using them wasn't the same since I already have Axios to get all the values from my APIs and I'm using an SPA so I wouldn't call an entire page from a server like PHP but just grab the components I need and modify the page according to my needs ( the page is dynamic ) I didn't get why I would use form since the action and method attributes aren't as useful as they used to be in PHP and I could just do all I need on a button with a type of button and get my info to the other components. And even if we were talking about a non-SPA app, it would use this.$router.push to get to the next page and you can even pass in the values in the link on a button click with a type of button and not type submit.
So my question to wrap it all up is how are forms used in Vue. Is it a common practice to use them ? The only thing I know is that it gives semantics.
Ok, this sounds crazy, but let me explain. I want a user to be able to push a button, and then the html file is edited in such a way that it a NEW p element is created, and stays there PERMENENTLY (eg on reload and for EVERYONE to see). Any way on how I could do that.
Again I am using node.js/express, and html/js/css.
It really depends upon exactly what you're doing.
Conceptually, you would probably use some sort of template system for generating your HTML files (like Jade, Dust, EJS, Handlebars, Nunjucks, PUG, etc..) and then you store some state in a database and use a query from the database as input to the template whenever you render a particular page.
So, when you add an item to the database, it will show up in all future renders of the page.
So, your button would trigger a form post to your server which would add an item to the database and the response from the form post would be a rendering of the page after adding the item to the database. All future renders of the page from all users would also show those same items in the rendered page.
I want to know if it is possible to directly modify and save a model instance in the HTML Template and not via a view and extra URL.
My user has a Boolean Property, I want to display it as a toggle button on the website and the user should be able to toggle it on or off without leaving the website or reloading it.
class User(AbstractBaseUser, PermissionsMixin):
...
autoplay_enabled = models.BooleanField(default=True)
...
Is this possible without an extra view or form?
Basically I just need to set
request.user.autoplay_enabled = False (or True)
and then save() it
If I can't modify the object directly in the HTML template is it at least possible to just execute a function I have defined somewhere in my Python code, without having the need to create a new view?
What you're asking doesn't make any sense at all. HTML is just sent to the browser for display. You can't do anything "from HTML" without making some kind of request to the server, and the server won't do anything unless that request is received by some code - eg a view connected to a URL.
If you want something to happen without refreshing the page, you need to use Ajax. You can use a simple Ajax POST to a view that toggles the value and saves it - it only needs a dozen lines of code between front and back end.
I pass a variable from the views.py file to multiple javascript template and want to refresh that variable every time I click on certain parts of the window. Loading the variable from views to the template is simple enough, but I don't know how to pass that variable back to the views then send it back to update the templates.
You would have to do that via Ajax. It's the only way you would be able to execute a server-side view and hand back data, most likely JSON, that could be used to update a JavaScript variable.
If you're looking for a way to automatically update the DOM when changes in client-side data occur, I highly recommend Knockout.js.
I read online about how to send a variable from javascript with ajax but I am not sure that solution fit my needs.
What I am trying to do is this:
I have an automated form for creating a row at my DB.
What I Want to do is run a javascript code that will create a variable with logic based on the user input and than send this variable along with all the other fields that are automatically being sent because of the automated creation and binding of the model.
Basically what I want is to add another array to the automated post call that I didn't wrote because it is being generated automatically by mvc. and than I can retrieve this variable (array at my case) at the create method on the controller
Do you have a solution for this?
Thank you very much
You could add some hidden fields to the form and use Javascript to fill their values in the submit event.