1

I'm trying to insert select-option values into my database using Ajax, but it will keep inserting a "0" to the database rather than the actual value or it will return as "null" value. I'm able to successfully insert select-option value without the Ajax code however. But I am able to insert values using a text input field with the Ajax code. The name values for my select and text input are the same (as they both should insert the same data to the database). When the select-option is hidden, the text input will insert its value to the database and vise versa. So my main question is, how do I get the actual value for the select-option to be inserted to the database (because all it inserts is "0" or returns with an error of "null")?

This is the html for the form, which includes the select-option and text input field which both carry the name="toctquant" attribute:

<form method="post" action="tocarthand.php?strid=<?php echo $prodtab->strid; ?>&prodid=<?php echo $prodtab->prodid; ?>" id="toctform">
    <select name="toctquant" id="quantsel" class="qinp">
        <?php $q = $prodtab->quant; ?>
        <?php for ($q = 1; $q <= 10; $q++): ?>
            <option value="<?php echo $q; ?>"><?php echo $q; ?></option>
        <?php endfor; ?>
        <?php if ($q > 10): ?>
            <option value="<?php echo $q; ?>"><?php echo $q; ?>+</option>
        <?php endif; ?>
    </select>
    <input type="text" name="toctquant" class="inphid qinp">
    <button type="submit" name="tocartbut" id="tocartbut">Add to Cart</button>
</form>
<div id="result"></div>

This is the Ajax code I am having problems with. It will only submit value for text input but not for the select-option value:

$("#toctform").submit(function(e) {
    var data = $("#toctform").serialize();
    $.ajax({
        data: data,
        type: "post",
        url: "tocarthand.php",
        success: function(data){
            alert("Data Save: " + data);
        }
    });
});

EDIT: Included php code for file tocarthand.php

$strid = (int)$_GET['strid'];
$prodid = (int)$_GET['prodid'];
$toctprodid = (int)$_GET['prodid'];
$toctuserid = $_SESSION['userid'];
$toctquant = $_POST['toctquant'];
$stmt = $conn->prepare("INSERT INTO tocart (toctprodid, toctuserid, toctquant) VALUES (?, ?, ?)");
$stmt->bind_param("iii", $toctprodid, $toctuserid, $toctquant);
$stmt->execute();
$stmt->close();
header('Location: itempage.php?strid='.$strid.'&prodid='.$prodid.'&insert=success');
$conn->close();
chemdol
  • 13
  • 5
  • the issues is with the php (most likely) so you need to include that –  May 27 '19 at 22:38
  • @tim ok included the php file and code – chemdol May 27 '19 at 22:41
  • your posting from ajax, so its $_POST in the php not $_GET –  May 27 '19 at 22:48
  • @tim The two `(int)$_GET['strid']` and `(int)$_GET['prodid']` are not for posting into the database. They are merely $_GET variables from the link address that are to be inserted into the `header()`. – chemdol May 27 '19 at 22:55
  • `$toctprodid = (int)$_GET['prodid'];` but the url called by ajax has no `prodid=` in it –  May 27 '19 at 23:05
  • @chemdol when selectbox is hidden and if not then hide the input. And hidden by php or js? This solve your problem. – daremachine May 27 '19 at 23:14
  • @tim ok thanks for pointing out that one mistake but I'm still having issues with the 0 inserted value – chemdol May 27 '19 at 23:34
  • @tim nm resolved this issue by adding a hidden input field - but still thanks for correcting that one mistake :) – chemdol May 27 '19 at 23:36

1 Answers1

0

Typo your select has name=toctquant but <input type="text" name="toctquant"> has same name which override the select before. Change different name.

Is it OK to have multiple HTML forms with the same name?

daremachine
  • 2,678
  • 2
  • 23
  • 34
  • Well that's why I mentioned in my description that they both have the same name for a reason. I looked this up and found that many answerers on StackOverflow concluded with "Yes, you can have the same `name+value` field for different inputs and they will still be inserted into the database without a problem." I even tried this myself without the Ajax code and it worked. So based on that conclusion alone, it wouldn't be a "typo" then would it? Unless this is a Ajax-only problem where all `name+value` fields MUST be unique. – chemdol May 27 '19 at 23:00
  • No in html5 is disallowed have same name in one form collection except radio buttons. – daremachine May 27 '19 at 23:03
  • But what you are referring to is HTML forms. My issue is with the _select_ and _input_ values. According to this answer here dated after the creation of your provided link: – chemdol May 27 '19 at 23:17
  • (wasn't finished with that last question): "No, the name attributes are not required to be unique. You could have the name attribute similar in multiple input fields" – chemdol May 27 '19 at 23:18
  • posted from this link https://stackoverflow.com/questions/25364924/do-input-names-have-to-be-unique-in-the-same-form – chemdol May 27 '19 at 23:19
  • ok I marked yours as best answer because I found that by adding a hidden input field I was able to insert the select name to database. Thanks greatly for your advice! – chemdol May 27 '19 at 23:39
  • I am glad to help you. FYI give same names in one form is always hell but not for now :) – daremachine May 27 '19 at 23:42