首页 > 解决方案 > 如何从输入中获取价值并发送到路由?

问题描述

我在模式窗口的输入中获得了价值,但我不能将它用于路由

我尝试使用 jQuery 获得价值,但它不适合我。

模态窗口 HTML:

<div class="modal fade" id="deleteValueModal" role="dialog">
    <div class="modal-content">
        <div class="modal-header">
            ...
        </div>
        <div class="modal-body">
            <form method="post" action="{{route('delete_value', $('#valueId').val())}}" id="deleteValueForm"                       
                        enctype="multipart/form-data">                        
                <label>Are you sure that you want to delete? 
                </label>        
            </form>
        </div>
        <div class="modal-footer">
            <input type="submit" id="valueId" name="valueId" value="" form="deleteValueForm" class="btn btn-primary">
        </div>
    </div>
</div>

JavaScript:

$(document).on("click", ".open-deleteValueModal", function () {
    const myValue = $(this).data('id');
    $(".modal-body #valueId").val( myValue );

IDE 以表单形式向我显示 jQuery 代码警告:

Expected: identifier

Laravel 也向我展示了 jQuery 的错误:

syntax error, unexpected '(', expecting variable (T_VARIABLE) or '{' or '$' (View: ... )

标签: phpjqueryhtmllaravel

解决方案


假设您的命名路线delete_value如下所示/posts/delete/{id}。那么您应该使用默认值(例如“0”)呈现您的表单,如下所示:

{{route('delete_value', 0)}}

现在在刀片渲染之后,动作应该是这样的:

http://localhost:8000/posts/delete/0

最后,您可以使用 jQuery 直接更新操作值,如下所示:

$(document).on("click", ".open-deleteValueModal", function () {
    const myValue = $(this).data('id');

    // Optional validation
    if (parseInt(myValue) <= 0 || myValue == "") {alert('Some validation message');return;}
    // Get the default route
    var route = $("#deleteValueForm").attr("action");
    // Remove the current ID value
    route = route.substr(0, route.lastIndexOf("/")+1);
    // Attach the new ID value to the route
    route += myValue;
    // Update the form action with the new route
    $("#deleteValueForm").attr("action", route);
});

为什么会出现此错误:

您向 route() 方法传递了一个意外的值$('#valueId').val(),其中需要一个 'String'、[PHP=>Array] 或 $(varible)。

笔记:

您只能在加载后更改 DOM 元素属性。


推荐阅读