Hi Timothy,
What you could do is create a function that gets the id of the form. It can
then query the action of the form and the parameters of the form. It would
look something like this:
function submitForm(form_id) {
var $form = $("#" + form_id);
$.ajax({
type: 'POST',
url: $form.attr('action'),
dataType: 'html', data: $form.serialize(), success: function(data){
$("#old_div_content").html(data); }, error: function(xhr, textStatus,
errorThrown) { console.log('AJAX communication failed:',
textStatus, errorThrown); } });
}
This way it is pretty generic as long as the "old_div_content" div id stays
the same.
Regards,
Andréas
Med vänliga hälsningar,
Andréas Kühne
Software Development Manager
Suitopia Scandinavia AB
2014-02-28 15:48 GMT+01:00 Timothy W. Cook <[email protected]>:
>
> On Thu, Feb 27, 2014 at 10:18 AM, Andreas Kuhne <
> [email protected]> wrote:
>
>> Hi again Timothy,
>>
>> Actually it's much easier than you think.
>>
>
>
> Great news! :-)
>
>
>>
>> The error you showed is a validation error, is it not?
>>
>>
> Yes.
>
>
> In the example that you gave (below) it seems that I will need an AJAX
> function for each different form. Correct?
> IOW:
> There are 25 different forms/views/models that can be selected, one at a
> time, for create or update in this div. So, do I understand correctly that
> I need a function with the correct URL and data map for each one of those?
> If so, what is the approach to calling the one the user has selected? My
> urks are named, for example: dvtemporal_create and dvtemporal_update. Of
> course the _update has the record id as well.
>
> There is a lot of information in the Django request so I want to be able
> to reuse this with an 'abstract as possible' ajax function.
>
> Thoughts?
>
> --Tim
>
>
>
>> What you do is that you submit the form via jquery ajax, something like
>> this should work:
>>
>> $.ajax({ type: 'POST', url: the_form_url, dataType: 'html', data: {
>> email : $('#id_email').val(), name : $('#id_name').val(), phone :
>> $('#id_phone').val() }, success: function(data){
>> $("#old_div_content").html(data); }, error: function(xhr, textStatus,
>> errorThrown) { console.log('AJAX communication failed:',
>> textStatus, errorThrown); } });
>>
>> Now you will have to change the function so that the parameters sent to
>> your view are correct (in the data map), the url is correct and the success
>> method changes the correct div. You won't have to do any error handling in
>> jquery at all, because the validation is on the server. When you replace
>> the html in the div that you want to replace, the user will just get the
>> validation errors that django creates for you.
>>
>> You really don't have to change anything in the view that you are using
>> at the moment, because it already returns the information that you want in
>> the div, all you have to do is get in into the div :-)
>>
>> Regards,
>>
>> Andréas
>>
>>
>> 2014-02-27 14:06 GMT+01:00 Timothy W. Cook <[email protected]>:
>>
>>> Hi Andreas,
>>>
>>> Thanks for the reply.
>>>
>>>
>>> On Thu, Feb 27, 2014 at 9:42 AM, Andreas Kuhne <
>>> [email protected]> wrote:
>>>
>>>> Hi Timothy,
>>>>
>>>> What you probably have to do is submit the form in a ajax call via
>>>> jquery for example. https://api.jquery.com/jQuery.ajax/
>>>>
>>>> You create a request via the ajax method in jquery and then add a
>>>> success and error handler. They only have to update the div you want to
>>>> replace: $("#div_id").html(response).
>>>>
>>>>
>>>
>>> This certainly seems like a reasonable approach. The points I am unsure
>>> of is:
>>>
>>> 1) how do I catch the template error in jQuery?
>>>
>>> 2) I suppose that I have to (somehow) catch the error in the ModelForm?
>>>
>>> 3) then send that request to jQuery, somehow?
>>>
>>> My forms and views are pretty simple at this point. Here are examples:
>>>
>>> class DvCodedStringCreateView(CreateView):
>>> template_name = 'dvcodedstring_create.html'
>>> success_url = '/dashboard'
>>> model = DvCodedString
>>> form_class = DvCodedStringCreateForm
>>> fields =
>>> ['published','prj_name','data_name','lang','description','sem_attr','resource_uri','asserts',
>>>
>>> 'terminology','term_subset','codes','t_code','t_string','t_name','t_abbrev','t_version',
>>>
>>> 'min_length','max_length','exact_length','enums','enums_annotations','default_value',]
>>>
>>>
>>>
>>>
>>> class DvCodedStringCreateForm(forms.ModelForm):
>>> class Meta:
>>> model = DvCodedString
>>> widgets = {
>>> 'data_name': TextInput(attrs={'size':90}),
>>> 'description': Textarea(attrs={'cols':80,
>>> 'rows':5,'wrap':'off'}),
>>> 'sem_attr': Textarea(attrs={'cols':15,
>>> 'rows':3,'wrap':'off'}),
>>> 'resource_uri': Textarea(attrs={'cols':60,
>>> 'rows':3,'wrap':'off'}),
>>> 'asserts': Textarea(attrs={'cols':80,
>>> 'rows':2,'wrap':'off'}),
>>> 'enums': Textarea(attrs={'cols':30,
>>> 'rows':5,'wrap':'off'}),
>>> 'enums_annotations': Textarea(attrs={'cols':50,
>>> 'rows':5,'wrap':'off'}),
>>> 't_code': Textarea(attrs={'cols':15,
>>> 'rows':5,'wrap':'off'}),
>>> 't_string': Textarea(attrs={'cols':30,
>>> 'rows':5,'wrap':'off'}),
>>> 't_abbrev': Textarea(attrs={'cols':10,
>>> 'rows':5,'wrap':'off'}),
>>> 't_version': Textarea(attrs={'cols':10,
>>> 'rows':5,'wrap':'off'}),
>>> 't_name': Textarea(attrs={'cols':40,
>>> 'rows':5,'wrap':'off'}),
>>>
>>> }
>>>
>>>
>>>
>>> Thanks in advance for any further guidance.
>>>
>>> --Tim
>>>
>>>
>>>
>>>
>>>> 2014-02-27 12:38 GMT+01:00 Timothy W. Cook <[email protected]>:
>>>>
>>>>> I have no idea where to start on this problem.
>>>>> My application is work great using the admin UI but to enhance
>>>>> usability it is time for a new user interface.
>>>>>
>>>>> I am using dynatree.js to create a 'Project' tree with subelements
>>>>> (called PcTs) grouped into types; IOW: There are three levels before you
>>>>> get to an editable component. Hence the reason to use a tree instead of
>>>>> paging through the admin UI.
>>>>>
>>>>> So my UI (Selection_001.png) uses <div> tags to layout the spaces.
>>>>> Basically tree on the left and a larger editing space next to it. My
>>>>> forms a re properly placed inside the scrollable <div>. My problem is
>>>>> when
>>>>> I get an error in the form, how do I control it so that it is only
>>>>> displayed in the same <div> where the form was displayed? What I get now
>>>>> is a full page reload. See Selection_002.png
>>>>>
>>>>> The template does not use any extend or include directives. It is a
>>>>> completely self contained HTML file.
>>>>> There are forms and views for each of the PcTs.
>>>>>
>>>>>
>>>>> Any ideas on where to start working on this?
>>>>>
>>>>>
>>>>>
>>>>>
>>>>>
>>>>> --
>>>>> MLHIM VIP Signup: http://goo.gl/22B0U
>>>>> ============================================
>>>>> Timothy Cook, MSc +55 21 994711995
>>>>> MLHIM http://www.mlhim.org
>>>>> Like Us on FB: https://www.facebook.com/mlhim2
>>>>> Circle us on G+: http://goo.gl/44EV5
>>>>> Google Scholar: http://goo.gl/MMZ1o
>>>>> LinkedIn Profile:http://www.linkedin.com/in/timothywaynecook
>>>>>
>>>>> --
>>>>> You received this message because you are subscribed to the Google
>>>>> Groups "Django users" group.
>>>>> To unsubscribe from this group and stop receiving emails from it, send
>>>>> an email to [email protected].
>>>>> To post to this group, send email to [email protected].
>>>>> Visit this group at http://groups.google.com/group/django-users.
>>>>> To view this discussion on the web visit
>>>>> https://groups.google.com/d/msgid/django-users/CA%2B%3DOU3UZppis4c8rr_Ok9rQ_SO6uXK6iii8HG7cPHE9qq1CWLw%40mail.gmail.com
>>>>> .
>>>>> For more options, visit https://groups.google.com/groups/opt_out.
>>>>>
>>>>
>>>> --
>>>> You received this message because you are subscribed to the Google
>>>> Groups "Django users" group.
>>>> To unsubscribe from this group and stop receiving emails from it, send
>>>> an email to [email protected].
>>>> To post to this group, send email to [email protected].
>>>> Visit this group at http://groups.google.com/group/django-users.
>>>> To view this discussion on the web visit
>>>> https://groups.google.com/d/msgid/django-users/CALXYUbno2-CvWgs%2BZjTWO7zU0C3YkvnzLCs3S0stiPGvDvBPBA%40mail.gmail.com
>>>> .
>>>> For more options, visit https://groups.google.com/groups/opt_out.
>>>>
>>>
>>>
>>>
>>> --
>>> MLHIM VIP Signup: http://goo.gl/22B0U
>>> ============================================
>>> Timothy Cook, MSc +55 21 994711995
>>> MLHIM http://www.mlhim.org
>>> Like Us on FB: https://www.facebook.com/mlhim2
>>> Circle us on G+: http://goo.gl/44EV5
>>> Google Scholar: http://goo.gl/MMZ1o
>>> LinkedIn Profile:http://www.linkedin.com/in/timothywaynecook
>>>
>>> --
>>> You received this message because you are subscribed to the Google
>>> Groups "Django users" group.
>>> To unsubscribe from this group and stop receiving emails from it, send
>>> an email to [email protected].
>>> To post to this group, send email to [email protected].
>>> Visit this group at http://groups.google.com/group/django-users.
>>> To view this discussion on the web visit
>>> https://groups.google.com/d/msgid/django-users/CA%2B%3DOU3Uky1-JSEsW8towv4gQz9hFH_c5dx1w6HaCdRA%2B9ZKshA%40mail.gmail.com
>>> .
>>>
>>> For more options, visit https://groups.google.com/groups/opt_out.
>>>
>>
>> --
>> You received this message because you are subscribed to the Google Groups
>> "Django users" group.
>> To unsubscribe from this group and stop receiving emails from it, send an
>> email to [email protected].
>> To post to this group, send email to [email protected].
>> Visit this group at http://groups.google.com/group/django-users.
>> To view this discussion on the web visit
>> https://groups.google.com/d/msgid/django-users/CALXYUbmK74Nk57X6gkMOWRxscsWbv6REo0g%3Dqu1k1mdZMuqMRg%40mail.gmail.com
>> .
>>
>> For more options, visit https://groups.google.com/groups/opt_out.
>>
>
>
>
> --
> MLHIM VIP Signup: http://goo.gl/22B0U
> ============================================
> Timothy Cook, MSc +55 21 994711995
> MLHIM http://www.mlhim.org
> Like Us on FB: https://www.facebook.com/mlhim2
> Circle us on G+: http://goo.gl/44EV5
> Google Scholar: http://goo.gl/MMZ1o
> LinkedIn Profile:http://www.linkedin.com/in/timothywaynecook
>
> --
> You received this message because you are subscribed to the Google Groups
> "Django users" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To post to this group, send email to [email protected].
> Visit this group at http://groups.google.com/group/django-users.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/django-users/CA%2B%3DOU3UD64_vHr8Cm7qHipLULX2qZv2Ego%3D-HuZHCWFyo9Redg%40mail.gmail.com
> .
>
> For more options, visit https://groups.google.com/groups/opt_out.
>
--
You received this message because you are subscribed to the Google Groups
"Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/django-users.
To view this discussion on the web visit
https://groups.google.com/d/msgid/django-users/CALXYUbk5VBeRdxygicuqQmMatKAQ2eC4KVjbEbwS-OUe2M9RSA%40mail.gmail.com.
For more options, visit https://groups.google.com/groups/opt_out.
