传递 Javascript 更新的值<input type="button">到 ASP.NET 代码后面

Question

I've got a set of buttons in my ASP.NET webpage that look like this:

<input id="B1" type="button" onclick="return change(this)" value="A" runat="server" />

The Javascript function would allow the button value to change between a set of values when clicked.

function change(elem)
    {
        if (elem.value === "A")
            elem.value = "B";
        else if (elem.value === "B")
            elem.value = "C";
        else
            elem.value = "A";
    }

In the code behind, the button value is passed into a SQL query:

cmd.Parameters.AddWithValue("@b1", B1.Value);

Ideally, when the entire webpage form is submitted, the current button values should be passed to the code behind. When inspecting the change through inspecting the element, I can verify that the value does update to the next option, and so on. But it seems to only pass the hardcoded value found in the input tag, ie. value "A" is sent to the code behind, regardless of whether the user changed the value to the other options.

There are no issues with the SQL query, as the "default" button values are inserted into the database.

Any insights would help. Thanks in advance.

Answer 1

when you use type="button" changed value can't be captured on post back, may be you could try using hidden input elements to achieve.

<script>
    function change(elem) {

        if (elem.value === "A")
            elem.value = "B";
        else if (elem.value === "B")
            elem.value = "C";
        else
            elem.value = "A";
        document.getElementById("<%=B1.ClientID%>").value = elem.value;

    }
</script>

HTML

 <input type="button" onclick="return change(this)" value="A" runat="server" />
<input id="B1" type="hidden" value="A" runat="server" />
<script