I am sending a data with ajax. How can I reset the data sending process?-CodePudding

When I select an account that has purchased a product, I bring up an option showing which product it is, but if we select an account that has purchased another product, this option comes for the second time.

my script code

$("select.account").on('change', function() {

    var accId = $(this).children("option:selected").val();
    
    console.log(accId);

    $.ajax({

        type: 'POST',
        url: 'netting/order-ajax.php',
        data: {
            'accId': accId
        },
        success: function(data) {
            
            if (data != "FALSE") {
                $('#accform').after(data);
                
            } else {
                $('#productform').hide();
            } 
        }
    })
})

image

my order-ajax.php

if (isset($_POST['accId'])) {

$sql = $db->qSql("SELECT * FROM sales INNER JOIN account ON sales.accId = account.accId INNER JOIN product ON sales.productId = product.productId WHERE sales.accId = '{$_POST['accId']}'");

if ($sql->rowCount() > 0) { ?>

    <div id="productform" >
        <label for="recipient-name" >Ürün & Hizmet</label>
        <select  required name="accId">
            <option value="">Ürün & Hizmet seçiniz...</option>
            <?php
            $sql = $db->read("product", [
                "columnsName" => "productId",
                "columnsSort" => "DESC"
            ]);
            while ($row = $sql->fetch(PDO::FETCH_ASSOC)) {   ?>
                <option value="<?= $row['productId'] ?>"><?= $row['productTitle'] ?></option>
            <?php } ?>
        </select>
    </div>

CodePudding user response：

.after(data) keeps adding more content at the end of your form.

Instead, create a specific div or something into which you want to place this content, and use .html(data) to write into it. This will then overwrite the content each time you run it, instead of appending it to what was added previously.

References: