Preventing my form to refresh using ajax

Question

Good day guys i just want to ask how to make a ajax to prevent page loads in my html form page the input i want to prevent from loading is button tags with type of submit and value of submit

in my case this is my html code:

            <div class="one">
                <label>living room<span></span></label>
                    <div><button type="submit" name="submit" id="one" class="test_1"  value="one"><p>Click On</p></button></div>    </div>
                    <div class="one"><li><button type="submit" name="submit" id="two" class="test_2" onmousedown="beepoff.play()" value="one_off">Click Off</button></li></div>


            <div class="one">
                <label>kitchen</label>
                    <button type="submit" name="submit" id="one" class="test_1"  value="two">Click On</button>
                </div>
                    <div class="one">
                        <button id="two" type="submit" name="submit" class="focus_one test_2"  value="two_off">Click Off</button>
                    </div></form>

Possible duplicate of [Submit form without page reloading](https://stackoverflow.com/questions/2866063/submit-form-without-page-reloading) — Chanakya Vadla, Feb 26 '18 at 09:02
Welcome to StackOverflow. Please take the [tour](http://stackoverflow.com/tour) have a look around, and read through the [HELP center](http://stackoverflow.com/help), then read [How to Ask Question](http://stackoverflow.com/help/how-to-ask), [What types of questions should I avoid asking?](http://stackoverflow.com/help/dont-ask) and provide a [MCVE : Minimal, Complete, and Verifiable Example](http://stackoverflow.com/help/mcve). If people around can easily read and understand what you mean, or what the problem is, they'll be more likely willing to help :) — Dwhitz, Feb 26 '18 at 09:03

score 1 · Answer 1 · answered Feb 26 '18 at 09:01

1

You can use the e.preventDefault() when your submit function is triggered.

function onSubmit(e){
   e.preventDefault()
   .... rest of code
}

answered Feb 26 '18 at 09:01

You should edit your question add your code because this is a common question and has been asked many times. – Feb 26 '18 at 09:40
that is my html form structure it calls php functions to be executed and this is the function //// shell_exec('java -jar DenkoviRelayCommandLineTool.jar DAE003wK 8 1 1'); /// i used it for our project home lights automation – pogi Feb 26 '18 at 11:21

score 0 · Answer 2 · answered Feb 26 '18 at 09:05

0

The easiest way is to use a button with type button, this will not submit the form.

<button type='button'>Text here</button>

answered Feb 26 '18 at 09:05

Joost Meijer

375
2
15

Preventing my form to refresh using ajax

2 Answers2