我的PHP表单中的所有链接都直接指向表单操作

Question

This is my following codes..

<form class="form-horizontal" id="tambah_gps" name="tambah_gps" method="POST" action="../controller/add_gps.php">
              <table>
                <tr style="height:40px">
                  <td>Nama User</td>
                  <td style="width:20px"> : </td>
                  <td><input class="form-control" type="text" name="nama_user" placeholder=" User Name" style="width:300px" readonly></td>
                  <td>&nbsp&nbsp<a href="javascript:void(0)" onClick=window.open("pilih_user.php","Ratting","width=1000,height=400,left=200,");><button class="btn btn-primary">Choose User</button></a></td>
                </tr>
                <tr style="height:40px">
                  <td>Vehicle ID</td>
                  <td style="width:20px"> : </td>
                  <td colspan="2"><input class="form-control" type="text" name="no_polisi" placeholder=" Nomor Polisi Kendaraan"></td>
                </tr>
                <tr style="height:40px">
                  <td>Car brand</td>
                  <td style="width:20px"> : </td>
                  <td colspan="2"><input class="form-control" type="text" name="merk_mobil" placeholder=" Merk Mobil"></td>
                </tr>
                <tr style="height:40px">
                  <td>Color</td>
                  <td style="width:20px"> : </td>
                  <td colspan="2"><input class="form-control" type="text" name="warna" placeholder=" Warna"></td>
                </tr>
                <tr style="height:40px">
                  <td>GPS Number</td>
                  <td style="width:20px"> : </td>
                            <td colspan="2"><input class="form-control" type="text" name="no_telp_gps" placeholder=" nomor telepon GPS"><td>
                </tr>
                <tr style="height:40px">
                  <td>Time Zone/td>
                  <td style="width:20px"> : </td>
                  <td colspan="2"><input class="form-control" type="text" name="zona_waktu" value="GMT (Default)" placeholder=" Zona Waktu" readonly></td>
                </tr>
              </table>
              <div class="modal-footer">
                <button  class="btn btn-default" data-dismiss="modal">Cancel</button>
            <input type="submit" name="sumbit" value="Save" class="btn btn-primary">
</div>
<form>

The form I made has 3 buttons : 1 Button Save, 1 Button Cancel, and 1 button to choose User Name.. if the button to choose user name clicked, it will open new window that containing user list. the button works pretty well. but whenever it clicked the page always directed to the form action (just like when you click the save button). Can anyone tell me whats wrong with my code? Thank you...

Answer 1

First of all you use your <button> inside of <a> where latter has javascript:void(0) as href. If href is not needed then there no point to put <a> around <button>.

Second &nbps entity MUST end with ;

Third javascript in onclick must be enclosed by " . Single quotes should be used within javascript statement.

And last: you must tell <button> to be exactly what you want it to be: just button! by using type='button'

Therefore the line for your "Choose User" button looks as follows:

<td>&nbsp;&nbsp;<button type="button" class="btn btn-primary" onClick="window.open('pilih_user.php','Ratting','width=1000,height=400,left=200');">Choose User</button></a></td>