How can i prevent jquery add a string to url?-CodePudding

So i got a problem that when i click a submit button of a form, my action attribute link was added a new line that i don't want it

Here is modal that contain the form:

<!--modal-->
<div  id="changepass" tabindex="-1" aria-hidden="true">
    <div  role="document">
        <div >
            <div >
                <h5  id="exampleModalLabel2">Password changing</h5>
                <button type="button"  data-bs-dismiss="modal"
                    aria-label="Close"></button>
            </div>
            <form action="" id="passchange">
                <div >
                    <div >
                        <div >
                            <label  for="basic-default-password12">Enter New
                                Password</label>
                            <div >
                                <input type="password" 
                                    id="basic-default-password12"
                                    placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
                                    aria-describedby="basic-default-password2" name="newpass" />
                                <span id="basic-default-password2"
                                    ><i
                                        ></i></span>
                            </div>
                        </div>
                    </div>
                </div>
                <div >
                    <button type="button" 
                        data-bs-dismiss="modal">No</button>
                    <button type="submit" >Yes</button>
                    <!--Get id function-->
                </div>
            </form>
        </div>
    </div>
</div>
<!--/modal-->

Here is the button when i click, it will open modal box:

<div >

    <h5 ><?=$detail['last_name']?>'s Information</h5>
    <small ><button type="button" 
            data-id="<?=$detail['id']?>" onclick="changepassword(this)">Change
            password</button></small>
</div>

Here is jquery i'm using to pass a php value to the modal:

<script>

function changepassword(elm) {

    let id = $(elm).data('id');
    let modal = $('#changepass');
    $('#passchange').attr('action',
        `http://localhost/NguyenTranTienHiep1/index.php/backend/PasswordChange/${id}`);
    modal.modal('show');
}
</script>

So the link i want it to be on the url bar is (id is changable):

http://localhost/NguyenTranTienHiep1/index.php/backend/PasswordChange/id

here is the link that i don't expect it to be:

http://localhost/NguyenTranTienHiep1/index.php/backend/PasswordChange/30?newpass=test

i want to call a php function and it will grab the input but the line "?newpass=test" prevent it to run.

CodePudding user response：

Your form is using GET method to send data to server. Form with GET method will append a list of name/value pairs after the question mark (?) at the end of your URL and each one separated by an ampersand (&). You can change method to POST so you will get no data appended to the URL and sensitive data such as password changes should use POST.

<form action="" method="POST" id="passchange">

You can learn more about sending data to server in here

CodePudding user response：

<script>

function changepassword(elm) {

    let id = $(elm.target).attr('data-id');
    let modal = $('#changepass');
    $('#passchange').attr('action',
        `http://localhost/NguyenTranTienHiep1/index.php/backend/PasswordChange/${id}`);
    modal.modal('show');
}
</script>