passing jquery value to php with submit button

Question

this is the html code:

<form action='survey.php' method='post' class='mainForm'>
    <fieldset>
        <div class="widget first">
            <div class="head"><h5 class="iList">Text fields</h5></div>
                <div class="rowElem noborder"><label>Name:</label><div class="formRight"><input type="text" name="name"/></div><div class="fix"></div></div>
                <div class="rowElem noborder">
                    <label>Usual slider: </label>
                    <div class="formRight">
                        <div class="uiSliderInc"></div>
                    </div>
                    <div class="fix"></div>
                </div>
                <input type="submit" value="Submit form" class="greyishBtn submitForm" />
                <div class="fix"></div>

            </div>
        </fieldset>
    </form>

i have a slider with a range between 1 and 100 with this code:

<div class="uiSliderInc"></div>

in another file called "custom.js" i have this code:

$( ".uiSliderInc" ).slider({
    value:50,
    min: 0,
    max: 100,
    step: 1,
    slide: function( event, ui ) {
        $( "#amount" ).val( "$" + ui.value );
    }
});
$( "#amount" ).val( "$" + $( ".uiSliderInc" ).slider( "value" ) );

i wanna send the value of this slider once i press on the submit button to the same page so i can do some php things to it. i bought a theme complete with css and jquery code because i dont understand it but now i have to use it. so can anyone help me on how i send the value when i press the submit button?

this is explained [here](http://stackoverflow.com/questions/1917576/how-to-pass-javascript-variables-to-php#answer-1917626) — Kevin Kloet, Dec 09 '16 at 08:31
@KevinKloet that page on says that you cant pass clientside to serverside, which is what im aware of considering i want to submit it to the page. but that answer doesnt seem to even touch the jquery code? its just a bunch of sql queries — Munik, Dec 09 '16 at 08:36
@giorgio isnt the "value" in the jquery code supposed to handle the amount the slide says? — Munik, Dec 09 '16 at 08:37

score 1 · Accepted Answer · answered Dec 09 '16 at 08:32

You can use an hidden input

<fieldset>
    <div class="widget first">
        <div class="head"><h5 class="iList">Text fields</h5></div>
            <div class="rowElem noborder"><label>Name:</label><div class="formRight"><input type="text" name="name"/></div><div class="fix"></div></div>
            <div class="rowElem noborder">
                <label>Usual slider: </label>
                <div class="formRight">
                    <div class="uiSliderInc"></div>
                </div>
                <div class="fix"></div>
            </div>
            <input id="amount" type="hidden" name="amount"/>
            <input type="submit" value="Submit form" class="greyishBtn submitForm" />
            <div class="fix"></div>

        </div>
 </fieldset>

Then you can get value on server-side like this:

$amount= $_POST['amount'];

Custom.js

$( ".uiSliderInc" ).slider({
   value:50,
   min: 0,
   max: 100,
   step: 1,
   slide: function( event, ui ) {
      $( "#amount" ).val( "$" + ui.value );
   }
});

passing jquery value to php with submit button

1 Answers1