如何将data-id和data-value从select选项传递到laravel控制器？

<select id="mySelect">
    <option value="1" data-id="123" data-value="abc">Option 1</option>
    <option value="2" data-id="456" data-value="def">Option 2</option>
    <option value="3" data-id="789" data-value="ghi">Option 3</option>
</select>

<script>
    document.getElementById("mySelect").addEventListener("change", function() {
        var selectedOption = this.options[this.selectedIndex];
        var dataId = selectedOption.getAttribute("data-id");
        var dataValue = selectedOption.getAttribute("data-value");

        // 使用 AJAX 发送数据到 Laravel 控制器
        var xhr = new XMLHttpRequest();
        xhr.open("POST", "/process-data", true);
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.onreadystatechange = function() {
            if (xhr.readyState === 4 && xhr.status === 200) {
                // 处理响应
            }
        };
        xhr.send(JSON.stringify({ dataId: dataId, dataValue: dataValue }));
    });
</script>

Route::post('/process-data', 'DataController@processData');

use Illuminate\Http\Request;

class DataController extends Controller
{
    public function processData(Request $request)
    {
        $dataId = $request->input('dataId');
        $dataValue = $request->input('dataValue');

        // 在这里进行相应的处理

        return response()->json(['success' => true]);
    }
}