How to use Django's HTML form to edit a part of users profile.

Question

I have a user profile model I use django model forms to create and edit the users profiles Now I want to change only 2 fields on the profiles lat and lon . So on my Index.html I have a small html form . As soon as the user clicks locate me. The latitude and longitude are automatically filed in and the submit button will be clicked using Jquery. How do I use the details from this form to update my users lat and lon. Its just that I have not used django's HTML form's and I need to update the lat lon entered on this mini form to the users profile

        <form method="post" action="{{ ??????????? }}">
            <input id="jsLat" type="text" placeholder="latittude" >
            <input id="jsLon" type="text" placeholder="longitude">
            <button type="submit" id="submit">Submit</button>
        </form>

Do I create another view & url (that way I will have 2 profile edit views and 2 profile edit url's) to add the lat and lon to my existing profile. Or Is there a way I can use the existing view and url and update the 2 fields

below are my models

    class Profile(models.Model):
        user = models.OneToOneField(User, on_delete=models.CASCADE)
        city = models.CharField(max_length=100)
        age = models.DateField(blank=True, null=True)
        profile_image = models.ImageField(default='', blank=True, null=True)
 null=True)
        is_verified = models.BooleanField(default=False)
        lat = models.FloatField(blank=True, null=True)
        lon = models.FloatField(blank=True, null=True)

Below is my profiles view

@login_required
def edit_profile(request):
    if request.method == 'POST':
        user_form = UserEditForm(data=request.POST or None, instance=request.user)
        profile_form = ProfileEditForm(data=request.POST or None, instance=request.user.profile, files=request.FILES)
        if user_form.is_valid() and profile_form.is_valid():
                user_form.save()
                profile_form.save()
            return redirect('accounts:profile', username=request.user.username)
    else:
        user_form = UserEditForm(instance=request.user)
        profile_form = ProfileEditForm(instance=request.user.profile)

    context = {'user_form': user_form,
               'profile_form': profile_form}
    return render(request, 'accounts/profile_edit.html', context)

Below are my forms.py

class UserEditForm (forms.ModelForm):

    class Meta:
        model = User
        fields = ('first_name', 'last_name', 'email', 'username')

class ProfileEditForm(forms.ModelForm): #UserProfileForm or ProfileEdit

    class Meta:
        model = Profile
        fields = ('city', 'age', 'profile_image','lat','lon') 

Below are my urls

urlpatterns = [        
    url(r'^profile/(?P<username>[-\w]+)/$', views.ProfileView.as_view(), name='profile'),
    url(r'^edit_profile/$', views.edit_profile, name='edit_profile'),

#Profile created automatically when user is created
]

PS: I have trimmed the geodjango code from here as it's not a part of this question

Answer 1

You definitely can edit the details within the post of your view. Firstly, in your HTML you should name your inputs.

        <form method="post”>
        <input id="jsLat" type="text" placeholder="latittude" name=“Lat” >
        <input id="jsLon" type="text" placeholder="longitude" name=“Long”>
        <button type="submit" id="submit">Submit</button>
    </form>

Then in your post view you can retrieve the data by doing: lat = request.POST[‘Lat’] or lon = request.POST[‘Lon’]

Next step is to update the database entry.

To do this you need to retrieve the user’s object.

user = User.objects.get(instance=request.user)

Once you have this you can update fields in the following manner:

user.latitude = lat
user.longitude = lon 
user.save()

Further reference:

1. Retrieving data from HTML form

2. Updating database entry

Hope this helps!

Edit:

It is rather recommended that you have the form as a Django form and then simply add the desired HTML attribute there. This allows you to call the form as you usually would for a Django form.