單擊按鈕時如何獲取選擇文本，表格單元格值

Question

首先，我是html和javascript的新手，所以請放輕松:)

我在html中有一個表，其中每一行都有一個下拉列表（具有相同的選項）和一個按鈕。 單擊按鈕后，我想將下拉/選擇中所選項目的文本以及另一個字符串傳遞給控制器​​。

到目前為止，我有

        <table>
            <tr>
                <td>First name</td>
                <td>Surname</td>
            </tr>
            @foreach (var row in Model.Rows)
            {
                <tr>
                    <td>@row.FirstName</td>
                    <td>
                        <select id="surnames">
                            @foreach (var name in Model.Surnames)
                            {
                                <option value=@name.ToString()>@name.ToString()</option>
                            }
                        </select>
                    </td>
                    <td><input type="button" id="myButton" value="Go" onclick="location.href='@Url.Action("MyAction", "MyController", new { @firstName = row.FirstName, @newSurname = ??? })'" /></td>
                </tr>
            }
        </table>

        <script>
            function getSelectedVersion() {
                var version = document.getElementById("surnames").text;
            }
        </script>

顯然，這是我代碼的精簡和修改版本。 實際上，我在模型的每個行中都有更多屬性。

據我了解，我目前存在一個ID問題，因為對於所有行，我的選擇都具有相同的ID。 缺少為每行添加腳本的想法，我想不出什么辦法，它可以工作（我認為），但效果不佳（在表的每一行中進行一次foreach，然后在表外部進行標記以分配腳本）到每一行的下拉菜單）

最重要的是，我缺少調用腳本以獲取文本，然后單擊按鈕將其傳遞到控制器的位。

理想情況下，我想將整個行對象傳遞給控制器​​，但是現在我已經解決了這一問題，只需要字符串firstName即可。

在表中，只有一個Names集合（而不是模型中的每個Rows）用於表中的每一行，因為每個表的選項始終相同。

Answer 1

在html代碼頂部包含jQuery

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

然后在代碼底部添加以下代碼：

<script>
  $("input[type=button]").on("click", function(){ 
  var FIRSTNAME  = ($(this).parent().prev().prev()).html(); 
  //alert(FIRSTNAME);
  var   NEWSURNAME  = ($(this).parent().prev().children().attr("selected", "selected")).val(); 
  //alert(NEWSURNAME);
  $.post("/MyController/MyAction", { firstName: FIRSTNAME, newSurname: NEWSURNAME } );  
});
</script>

Answer 2

可能是這樣嗎？

<input type="button" onclick="location.href='@Url.Action("MyAction", "MyController", new {})' + '?' + 'newSurname='+getSelectedVersion()"/>