Range Slider connected to Database Form Input

Hello all!

What I am trying to do is have a range slider be integrated with WIX’s form that connects to a database.


Here is the example of the exact slider I’m trying to integrate into the WIX forms.
I can’t even find the code WIX uses for their form elements!

The value goes between 1-100. I would like that value to be able to be submitted and then go into a database.

Any advice would be much appreciated!

Here is the html I used for it:

.slidecontainer { width: 100%; }

.slider {
-webkit-appearance: none;
width: 100%;
height: 15px;
background: #d3d3d3;
outline: none;
opacity: 0.7;
-webkit-transition: .2s;
transition: opacity .2s;
}

.slider:hover {
opacity: 1;
}

.slider::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 15px;
height: 15px;
background: #4CAF50;
cursor: pointer;
}

.slider::-moz-range-thumb {
width: 25px;
height: 25px;
background: #4CAF50;
cursor: pointer;
}

Hi Aramis,
My suggestion is to use postMessage and onMessage methods to communicate between the page and the HTML component.
Check out this this article
Here you have an example from the forum
Good luck
Roi

Hey, Aramis,

Did you ever get this working? if so, could I see your code?

Thanks,
Matt