Add one or multiple forms sitewide and submit using Ajax
I have one form that appear site wide in footer. I submit this form using Ajax.
On some pages can exist also other forms.
Usually I use a CBV for create and update.
class CreateItem(CreateView):
model = Item
form_class = ItemForm
<form action="" method="post">
% csrf_token %
form.name
In this case, I can't use the above. For view on submit, I have:
class FooterAddView(View):
def post(self, request):
if request.is_ajax():
.....
I need some help on the token for Ajax, and load/pass the form sitewide.
ajax django django-forms
asked Nov 12 at 8:15
user3541631
1,06821334
add a comment |
I have one form that appear site wide in footer. I submit this form using Ajax.
On some pages can exist also other forms.
Usually I use a CBV for create and update.
class CreateItem(CreateView):
model = Item
form_class = ItemForm
<form action="" method="post">
% csrf_token %
form.name
In this case, I can't use the above. For view on submit, I have:
class FooterAddView(View):
def post(self, request):
if request.is_ajax():
.....
I need some help on the token for Ajax, and load/pass the form sitewide.
ajax django django-forms
asked Nov 12 at 8:15
user3541631
1,06821334
I'm sorry earlier I've forgot to define the form_class and template for the view Class, I usually solve these views with function based views where these are not needed. So I updated my answer fixing these small things in my answer.
– Zollie
Nov 12 at 11:15
add a comment |
I have one form that appear site wide in footer. I submit this form using Ajax.
On some pages can exist also other forms.
Usually I use a CBV for create and update.
class CreateItem(CreateView):
model = Item
form_class = ItemForm
<form action="" method="post">
% csrf_token %
form.name
In this case, I can't use the above. For view on submit, I have:
class FooterAddView(View):
def post(self, request):
if request.is_ajax():
.....
I need some help on the token for Ajax, and load/pass the form sitewide.
ajax django django-forms
asked Nov 12 at 8:15
user3541631
1,06821334
I have one form that appear site wide in footer. I submit this form using Ajax.
On some pages can exist also other forms.
Usually I use a CBV for create and update.
class CreateItem(CreateView):
model = Item
form_class = ItemForm
<form action="" method="post">
% csrf_token %
form.name
In this case, I can't use the above. For view on submit, I have:
class FooterAddView(View):
def post(self, request):
if request.is_ajax():
.....
I need some help on the token for Ajax, and load/pass the form sitewide.
ajax django django-forms
ajax django django-forms
asked Nov 12 at 8:15
user3541631
1,06821334
asked Nov 12 at 8:15
user3541631
1,06821334
asked Nov 12 at 8:15
user3541631
1,06821334
asked Nov 12 at 8:15
user3541631
1,06821334
asked Nov 12 at 8:15
user3541631
1,06821334
1,06821334
I'm sorry earlier I've forgot to define the form_class and template for the view Class, I usually solve these views with function based views where these are not needed. So I updated my answer fixing these small things in my answer.
– Zollie
Nov 12 at 11:15
add a comment |
I'm sorry earlier I've forgot to define the form_class and template for the view Class, I usually solve these views with function based views where these are not needed. So I updated my answer fixing these small things in my answer.
– Zollie
Nov 12 at 11:15
I'm sorry earlier I've forgot to define the form_class and template for the view Class, I usually solve these views with function based views where these are not needed. So I updated my answer fixing these small things in my answer.
– Zollie
Nov 12 at 11:15
I'm sorry earlier I've forgot to define the form_class and template for the view Class, I usually solve these views with function based views where these are not needed. So I updated my answer fixing these small things in my answer.
– Zollie
Nov 12 at 11:15
add a comment |
1 Answer
1
active
oldest
votes
Your post() (and now I updated it with get() too) in the view Class will look like this basically:
from django.http import HttpResponseRedirect
from django.template.loader import get_template
from django.shortcuts import render
from django.views import View
from django.http import JsonResponse
from .forms import ItemForm
class FooterAddView(View):
form_class = ItemForm
# initial = 'key': 'value'
template_name = 'myformtemplate.html'
def get(self, request, *args, **kwargs):
form = self.form_class() # you can pass the initials here too
return render(request, self.template_name, 'form2': form)
def post(self, request, *args, **kwargs):
if request.is_ajax():
form = self.form_class(request.POST)
if form.is_valid():
# <process form cleaned data>
data = form.cleaned_data
# then save
form.save()
return JsonResponse(data)
# or return HttpResponseRedirect('/success/')
else:
form = self.form_class()
print(form.errors)
# return form.errors
form = self.form_class()
return render(request, self.template_name, 'form2': form)
And you will provide the csrf token in the template file of the view(and form) like this:
templates/myformtemplate.html
<form action="#" method="post">
% csrf_token %
form2
<input type="submit" value="Submit">
</form>
I hope this can help you in your project.
And regarding the form token: the token will automatically be included in the ajax call (data: $('form').serialize(),) at form submission. More forms on one page also cannot really cause a problem in this question.
Now, I did not really understand the second part of your question first about using the created Form ’sitewide’. Then I had to understand that you maybe did not study the template system of Django deeper yet and that is why you ask that question.
So, applying this view (with the form and template) at the footer of your website:
In your application templates folder (you have to create it):
1. You have a base.html which is extendable (can also be included templates in it) with template tags like the following in the base template:
<body>
% block content % % endblock content %
% block footer %% include "myformtemplate.html" %% endblock footer %
</body>
You extend this base.html template with your content templates at every page.
2. And you will include the template what you create for the form in the base template’s footer block
like this simple form template in the myformtemplate.html:
<div>
<form action="#" method="post">
% csrf_token %
form2
<button type="button" name="myformbutton" id="myform2">Submit me</button>
</form>
</div>
<script>
var $j = jQuery.noConflict();
$j( document ).ready(function()
$j('#myform2').on('click', function (e)
e.preventDefault();
$j.ajax(
type: 'POST',
url:'/newitem/', // the url that is defined in urls.py for the FooterAddView
data: $j('form').serialize(),
success: function()
alert('created');
,
error: function(response)
alert('not submitted');
console.log(response);
)
)
);
</script>
And this way your template (with the above view and Form) will be at every site of your website in the footer part of your website.
Important: in order to have your form rendered in another view where you include your form template, you should define the form in that particular view too (like: form = ItemForm and in rendering part 'form2': form. You should use 'form2' for example if you have more forms on the same page/view. And your form could be rendered in any page on the website. Otherwise you can just create your own HTML form (instead of Django rendered html form) in a form template and you can submit that form via AJAX to the targeted view from anywhere on your website. I hope you can follow the concept of this.
I hope I did not misunderstand you on this part of your questions and that’s what you wanted to ask for. If you have more questions on this of how to include a view and template ‘sitewide’, then you need to study further the Django template system ie. here (there are really endless possibilities of where you include and where you not, small views/templates):
https://docs.djangoproject.com/en/2.1/ref/templates/builtins/
answered Nov 12 at 9:48
Zollie
35915
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53258126%2fadd-one-or-multiple-forms-sitewide-and-submit-using-ajax%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Your post() (and now I updated it with get() too) in the view Class will look like this basically:
from django.http import HttpResponseRedirect
from django.template.loader import get_template
from django.shortcuts import render
from django.views import View
from django.http import JsonResponse
from .forms import ItemForm
class FooterAddView(View):
form_class = ItemForm
# initial = 'key': 'value'
template_name = 'myformtemplate.html'
def get(self, request, *args, **kwargs):
form = self.form_class() # you can pass the initials here too
return render(request, self.template_name, 'form2': form)
def post(self, request, *args, **kwargs):
if request.is_ajax():
form = self.form_class(request.POST)
if form.is_valid():
# <process form cleaned data>
data = form.cleaned_data
# then save
form.save()
return JsonResponse(data)
# or return HttpResponseRedirect('/success/')
else:
form = self.form_class()
print(form.errors)
# return form.errors
form = self.form_class()
return render(request, self.template_name, 'form2': form)
And you will provide the csrf token in the template file of the view(and form) like this:
templates/myformtemplate.html
<form action="#" method="post">
% csrf_token %
form2
<input type="submit" value="Submit">
</form>
I hope this can help you in your project.
And regarding the form token: the token will automatically be included in the ajax call (data: $('form').serialize(),) at form submission. More forms on one page also cannot really cause a problem in this question.
Now, I did not really understand the second part of your question first about using the created Form ’sitewide’. Then I had to understand that you maybe did not study the template system of Django deeper yet and that is why you ask that question.
So, applying this view (with the form and template) at the footer of your website:
In your application templates folder (you have to create it):
1. You have a base.html which is extendable (can also be included templates in it) with template tags like the following in the base template:
<body>
% block content % % endblock content %
% block footer %% include "myformtemplate.html" %% endblock footer %
</body>
You extend this base.html template with your content templates at every page.
2. And you will include the template what you create for the form in the base template’s footer block
like this simple form template in the myformtemplate.html:
<div>
<form action="#" method="post">
% csrf_token %
form2
<button type="button" name="myformbutton" id="myform2">Submit me</button>
</form>
</div>
<script>
var $j = jQuery.noConflict();
$j( document ).ready(function()
$j('#myform2').on('click', function (e)
e.preventDefault();
$j.ajax(
type: 'POST',
url:'/newitem/', // the url that is defined in urls.py for the FooterAddView
data: $j('form').serialize(),
success: function()
alert('created');
,
error: function(response)
alert('not submitted');
console.log(response);
)
)
);
</script>
And this way your template (with the above view and Form) will be at every site of your website in the footer part of your website.
Important: in order to have your form rendered in another view where you include your form template, you should define the form in that particular view too (like: form = ItemForm and in rendering part 'form2': form. You should use 'form2' for example if you have more forms on the same page/view. And your form could be rendered in any page on the website. Otherwise you can just create your own HTML form (instead of Django rendered html form) in a form template and you can submit that form via AJAX to the targeted view from anywhere on your website. I hope you can follow the concept of this.
I hope I did not misunderstand you on this part of your questions and that’s what you wanted to ask for. If you have more questions on this of how to include a view and template ‘sitewide’, then you need to study further the Django template system ie. here (there are really endless possibilities of where you include and where you not, small views/templates):
https://docs.djangoproject.com/en/2.1/ref/templates/builtins/
answered Nov 12 at 9:48
Zollie
35915
add a comment |
Your post() (and now I updated it with get() too) in the view Class will look like this basically:
from django.http import HttpResponseRedirect
from django.template.loader import get_template
from django.shortcuts import render
from django.views import View
from django.http import JsonResponse
from .forms import ItemForm
class FooterAddView(View):
form_class = ItemForm
# initial = 'key': 'value'
template_name = 'myformtemplate.html'
def get(self, request, *args, **kwargs):
form = self.form_class() # you can pass the initials here too
return render(request, self.template_name, 'form2': form)
def post(self, request, *args, **kwargs):
if request.is_ajax():
form = self.form_class(request.POST)
if form.is_valid():
# <process form cleaned data>
data = form.cleaned_data
# then save
form.save()
return JsonResponse(data)
# or return HttpResponseRedirect('/success/')
else:
form = self.form_class()
print(form.errors)
# return form.errors
form = self.form_class()
return render(request, self.template_name, 'form2': form)
And you will provide the csrf token in the template file of the view(and form) like this:
templates/myformtemplate.html
<form action="#" method="post">
% csrf_token %
form2
<input type="submit" value="Submit">
</form>
I hope this can help you in your project.
And regarding the form token: the token will automatically be included in the ajax call (data: $('form').serialize(),) at form submission. More forms on one page also cannot really cause a problem in this question.
Now, I did not really understand the second part of your question first about using the created Form ’sitewide’. Then I had to understand that you maybe did not study the template system of Django deeper yet and that is why you ask that question.
So, applying this view (with the form and template) at the footer of your website:
In your application templates folder (you have to create it):
1. You have a base.html which is extendable (can also be included templates in it) with template tags like the following in the base template:
<body>
% block content % % endblock content %
% block footer %% include "myformtemplate.html" %% endblock footer %
</body>
You extend this base.html template with your content templates at every page.
2. And you will include the template what you create for the form in the base template’s footer block
like this simple form template in the myformtemplate.html:
<div>
<form action="#" method="post">
% csrf_token %
form2
<button type="button" name="myformbutton" id="myform2">Submit me</button>
</form>
</div>
<script>
var $j = jQuery.noConflict();
$j( document ).ready(function()
$j('#myform2').on('click', function (e)
e.preventDefault();
$j.ajax(
type: 'POST',
url:'/newitem/', // the url that is defined in urls.py for the FooterAddView
data: $j('form').serialize(),
success: function()
alert('created');
,
error: function(response)
alert('not submitted');
console.log(response);
)
)
);
</script>
And this way your template (with the above view and Form) will be at every site of your website in the footer part of your website.
Important: in order to have your form rendered in another view where you include your form template, you should define the form in that particular view too (like: form = ItemForm and in rendering part 'form2': form. You should use 'form2' for example if you have more forms on the same page/view. And your form could be rendered in any page on the website. Otherwise you can just create your own HTML form (instead of Django rendered html form) in a form template and you can submit that form via AJAX to the targeted view from anywhere on your website. I hope you can follow the concept of this.
I hope I did not misunderstand you on this part of your questions and that’s what you wanted to ask for. If you have more questions on this of how to include a view and template ‘sitewide’, then you need to study further the Django template system ie. here (there are really endless possibilities of where you include and where you not, small views/templates):
https://docs.djangoproject.com/en/2.1/ref/templates/builtins/
answered Nov 12 at 9:48
Zollie
35915
add a comment |
Your post() (and now I updated it with get() too) in the view Class will look like this basically:
from django.http import HttpResponseRedirect
from django.template.loader import get_template
from django.shortcuts import render
from django.views import View
from django.http import JsonResponse
from .forms import ItemForm
class FooterAddView(View):
form_class = ItemForm
# initial = 'key': 'value'
template_name = 'myformtemplate.html'
def get(self, request, *args, **kwargs):
form = self.form_class() # you can pass the initials here too
return render(request, self.template_name, 'form2': form)
def post(self, request, *args, **kwargs):
if request.is_ajax():
form = self.form_class(request.POST)
if form.is_valid():
# <process form cleaned data>
data = form.cleaned_data
# then save
form.save()
return JsonResponse(data)
# or return HttpResponseRedirect('/success/')
else:
form = self.form_class()
print(form.errors)
# return form.errors
form = self.form_class()
return render(request, self.template_name, 'form2': form)
And you will provide the csrf token in the template file of the view(and form) like this:
templates/myformtemplate.html
<form action="#" method="post">
% csrf_token %
form2
<input type="submit" value="Submit">
</form>
I hope this can help you in your project.
And regarding the form token: the token will automatically be included in the ajax call (data: $('form').serialize(),) at form submission. More forms on one page also cannot really cause a problem in this question.
Now, I did not really understand the second part of your question first about using the created Form ’sitewide’. Then I had to understand that you maybe did not study the template system of Django deeper yet and that is why you ask that question.
So, applying this view (with the form and template) at the footer of your website:
In your application templates folder (you have to create it):
1. You have a base.html which is extendable (can also be included templates in it) with template tags like the following in the base template:
<body>
% block content % % endblock content %
% block footer %% include "myformtemplate.html" %% endblock footer %
</body>
You extend this base.html template with your content templates at every page.
2. And you will include the template what you create for the form in the base template’s footer block
like this simple form template in the myformtemplate.html:
<div>
<form action="#" method="post">
% csrf_token %
form2
<button type="button" name="myformbutton" id="myform2">Submit me</button>
</form>
</div>
<script>
var $j = jQuery.noConflict();
$j( document ).ready(function()
$j('#myform2').on('click', function (e)
e.preventDefault();
$j.ajax(
type: 'POST',
url:'/newitem/', // the url that is defined in urls.py for the FooterAddView
data: $j('form').serialize(),
success: function()
alert('created');
,
error: function(response)
alert('not submitted');
console.log(response);
)
)
);
</script>
And this way your template (with the above view and Form) will be at every site of your website in the footer part of your website.
Important: in order to have your form rendered in another view where you include your form template, you should define the form in that particular view too (like: form = ItemForm and in rendering part 'form2': form. You should use 'form2' for example if you have more forms on the same page/view. And your form could be rendered in any page on the website. Otherwise you can just create your own HTML form (instead of Django rendered html form) in a form template and you can submit that form via AJAX to the targeted view from anywhere on your website. I hope you can follow the concept of this.
I hope I did not misunderstand you on this part of your questions and that’s what you wanted to ask for. If you have more questions on this of how to include a view and template ‘sitewide’, then you need to study further the Django template system ie. here (there are really endless possibilities of where you include and where you not, small views/templates):
https://docs.djangoproject.com/en/2.1/ref/templates/builtins/
answered Nov 12 at 9:48
Zollie
35915
Your post() (and now I updated it with get() too) in the view Class will look like this basically:
from django.http import HttpResponseRedirect
from django.template.loader import get_template
from django.shortcuts import render
from django.views import View
from django.http import JsonResponse
from .forms import ItemForm
class FooterAddView(View):
form_class = ItemForm
# initial = 'key': 'value'
template_name = 'myformtemplate.html'
def get(self, request, *args, **kwargs):
form = self.form_class() # you can pass the initials here too
return render(request, self.template_name, 'form2': form)
def post(self, request, *args, **kwargs):
if request.is_ajax():
form = self.form_class(request.POST)
if form.is_valid():
# <process form cleaned data>
data = form.cleaned_data
# then save
form.save()
return JsonResponse(data)
# or return HttpResponseRedirect('/success/')
else:
form = self.form_class()
print(form.errors)
# return form.errors
form = self.form_class()
return render(request, self.template_name, 'form2': form)
And you will provide the csrf token in the template file of the view(and form) like this:
templates/myformtemplate.html
<form action="#" method="post">
% csrf_token %
form2
<input type="submit" value="Submit">
</form>
I hope this can help you in your project.
And regarding the form token: the token will automatically be included in the ajax call (data: $('form').serialize(),) at form submission. More forms on one page also cannot really cause a problem in this question.
Now, I did not really understand the second part of your question first about using the created Form ’sitewide’. Then I had to understand that you maybe did not study the template system of Django deeper yet and that is why you ask that question.
So, applying this view (with the form and template) at the footer of your website:
In your application templates folder (you have to create it):
1. You have a base.html which is extendable (can also be included templates in it) with template tags like the following in the base template:
<body>
% block content % % endblock content %
% block footer %% include "myformtemplate.html" %% endblock footer %
</body>
You extend this base.html template with your content templates at every page.
2. And you will include the template what you create for the form in the base template’s footer block
like this simple form template in the myformtemplate.html:
<div>
<form action="#" method="post">
% csrf_token %
form2
<button type="button" name="myformbutton" id="myform2">Submit me</button>
</form>
</div>
<script>
var $j = jQuery.noConflict();
$j( document ).ready(function()
$j('#myform2').on('click', function (e)
e.preventDefault();
$j.ajax(
type: 'POST',
url:'/newitem/', // the url that is defined in urls.py for the FooterAddView
data: $j('form').serialize(),
success: function()
alert('created');
,
error: function(response)
alert('not submitted');
console.log(response);
)
)
);
</script>
And this way your template (with the above view and Form) will be at every site of your website in the footer part of your website.
Important: in order to have your form rendered in another view where you include your form template, you should define the form in that particular view too (like: form = ItemForm and in rendering part 'form2': form. You should use 'form2' for example if you have more forms on the same page/view. And your form could be rendered in any page on the website. Otherwise you can just create your own HTML form (instead of Django rendered html form) in a form template and you can submit that form via AJAX to the targeted view from anywhere on your website. I hope you can follow the concept of this.
I hope I did not misunderstand you on this part of your questions and that’s what you wanted to ask for. If you have more questions on this of how to include a view and template ‘sitewide’, then you need to study further the Django template system ie. here (there are really endless possibilities of where you include and where you not, small views/templates):
https://docs.djangoproject.com/en/2.1/ref/templates/builtins/
answered Nov 12 at 9:48
Zollie
35915
edited Nov 13 at 11:36
answered Nov 12 at 9:48
Zollie
35915
answered Nov 12 at 9:48
Zollie
35915
answered Nov 12 at 9:48
Zollie
35915
35915
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53258126%2fadd-one-or-multiple-forms-sitewide-and-submit-using-ajax%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
I'm sorry earlier I've forgot to define the form_class and template for the view Class, I usually solve these views with function based views where these are not needed. So I updated my answer fixing these small things in my answer.
– Zollie
Nov 12 at 11:15