How to save jQuery slider value in Person model?

Question

I am trying to save the value of the jQuery element added to my SurveyWizardForm to my class Person(models.Model): and therefore my database.

All other elements in my form were created in the usual way, creating the necessary fields and widgets in my .py forms and data for each question in my models.py. As a result, they all work automatically, and the correct data is saved.

However, I configured my SurveyWizardForm on certain pages so that the user can submit a rating for the image using the jQuery slider.

My problem is that I cannot store this value in my Person model.

Question: How to save the value of my slider in slider_value in my Person model?

All my attempts so far have simply created a new record in the model / DB, which does not save the value that I have in my form /views.py. I am afraid that I will not connect the two parts correctly.

Any help is greatly appreciated. Thanks

My code is still

slider_two.js

This updates the hidden1 field of the hidden1 form with the value of the jQuery slider

  if($(this).attr("id") == "one") $("#hidden1").val((ui.value > 0 ? '+' : '') + ui.value); 

wizard_form.html

value="0" updated when the user moves the slider created in the above slider_two.js (not shown)

 <input type="hidden" name="slider_value" value="0" id="hidden1"/> <script src="{% static "survey/js/slider_two.js" %}"></script> 

views.py

I can read the value in views.py using

  slider_value = self.request.POST.get('slider_value') if slider_value is not None: instruction_task_values.insert(0, slider_value) logger.debug('\n\n\nThis is your instruction_task_values in 1 %s', instruction_task_values) 

This works when the correct value is printed every time in my log

models.py

This is intended to create a field in the database to store the value of the slider. all the other entries that I create work and save correctly.

 class Person(models.Model): slider_value = models.IntegerField(null=True, blank=True, max_length=1000) 

forms.py

That's where I find my problem.

Below is my attempt to “connect” to an existing slider_value in my form and add it to my Person model, but all it does is just create a new phial in my form.

 class SurveyFormIT1(forms.ModelForm): class Meta: model = Person fields = ['slider_value'] widgets = {'slider_value' : forms.HiddenInput} 

Answer 1

In the end, I found a way to solve this.

The main problem was that I was trying to add information to my Person model, which was not "generated / originated" from my forms.py / models.py traditional way, but rather was "generated" on a page from my jQuery script.

I knew that I needed to create a model field and a corresponding form field that would take on a value. Initially, I thought that I should send this value to my views.py (as mentioned above). This was wrong.

When I looked at the output html pages from SessionWizardView / form_wizard, I realized that even if I called each of the form fields, for example. field = ['slider_one_value'] it was issued, for example,

 <input id="id_9-slider_one_value" type="hidden" name="9-slider_one_value" value="-37"></input> 

Added id_9- , as it was on the ninth page of the survey.

As a result, if I changed my jQuery to update this field at the same time as the main hidden field sent to my views, the value will be automatically saved in my model

The best part is that I can update as many fields as I want from the same script

I hope this helps someone else

My code

wizard_form.html

This calls my slider_two.js script

 <script src="{% static "survey/js/slider_two.js" %}"></script> 

slider_two.js

Creates a slider on the page that the user can move. Then it updates the result and the hidden field that is sent to the views

It also updates newly created hidden fields that correspond to those that were created in the model after they were processed through SessionWizardView

 $('#submit').click(function() { var username = $('#hidden').val(); if (username == "") username = 0; $.post('comment.php', { hidden: username }, function(return_data) { alert(return_data); }); }); $(".slider").slider({ animate: true, range: "min", value: 0, min: -100, max: +100, step: 1, //This updates the slider-result below the slider bar so the participant can see their rating slide: function(event, ui) { $("#slider-result").html((ui.value > 0 ? '+' : '') + ui.value); //This updates the hidden form field which is read by my views.py if($(this).attr("id") == "one") $("#hidden1").val((ui.value > 0 ? '+' : '') + ui.value); //This updates the id_9-slider_one_value form field which matches the name of fields = ['slider_one_value'] after it has been rendered if($(this).attr("id") == "one") $("#id_9-slider_one_value").val(ui.value); //This updates the id_10-slider_two_value form field which matches the name of fields = ['slider_one_value'] after it has been rendered if($(this).attr("id") == "one") $("#id_10-slider_two_value").val(ui.value); .... // Update as many hidden forms fields as necessary } }); 

models.py

Creates database entries to store values

 slider_one_value = models.SmallIntegerField(null=True, max_length=100, blank=True) slider_two_value = models.SmallIntegerField(null=True, max_length=100, blank=True) 

forms.py

Creates hidden form fields to accept values ​​from jQuery script

 class SurveyFormF1(forms.ModelForm): class Meta: model = Person fields = ['slider_one_value'] widgets = {'slider_one_value' : forms.HiddenInput} class SurveyFormF2(forms.ModelForm): class Meta: model = Person fields = ['slider_two_value'] widgets = {'slider_two_value' : forms.HiddenInput} 

Answer 2

You should consider editing code with forms correctly.

For example, in views.py :

 def my_view(request): # if this is a POST request we need to process the form data if request.method == 'POST': # create a form instance and populate it with data from the request: form = SurveyFormIT1(request.POST) # check whether it valid: if form.is_valid(): # process the data in form.cleaned_data as required slider_value = form.cleaned_data['slider_value'] if slider_value is not None: instruction_task_values.insert(0, slider_value) logger.debug('\n\n\nThis is your instruction_task_values in 1 %s', instruction_task_values) # redirect to a new URL: return HttpResponseRedirect('/thanks/') # if a GET (or any other method) we'll create a blank form else: form = SurveyFormIT1() return render(request, 'wizard_form.html', {'form': form}) 

In wizard_form.html :

 {{ form.as_p }} <script src="{% static "survey/js/slider_two.js" %}"></script> 

{{ form.as_p }} will just give you something like

 <input type="hidden" name="slider_value" value="" id="id_slider_value"/> 

Answer 3

you should do something like this

 if request.method == 'POST': form = SurveyFormIT1(request.POST) if form.is_valid(): survey=form.save(commit=False) survey.slider_value=form.cleaned_data['slider_value'] survey.save() 

First you have to check if you get the correct value in your request, as soon as you receive it, you just manually save it, as in the example above. You must also exclude the slider_value field from the form, as it will not be valid until you pass the correct value to it.

I know there are more elegant solutions, but it's easy to understand.

Hope this helps