Javascript 提交表单时更新会话变量。AJAX拉维尔

我想做的是，当我提交带有票证代码的表单时，变量应该在不刷新页面的情况下更新。我现在只实现了在不刷新页面的情况下提交表单，而且可以正常工作。如果我提交表单，然后手动刷新页面，变量会发生变化，但我可以再次提交相同的表单。所以我想阻止这种情况。这是我的表格：

表格

 <form id="ticket" action="prekiu-uzsakymas" method="get">
                        <input type="text" name="ticket">
                        <input id="btnSubmit" type="submit" value="Panaudoti kuponą">
                    </form>

   @if ( !request()->session()->get('ticket') )
       <form id="ticket" action="prekiu-uzsakymas" method="POST">
           <input type="text" name="ticket">
           <input id="btnSubmit" type="submit" value="Panaudoti kuponą">
       </form>
   @else
        <h4>
            <span class="label label-success">
                <i style="color: white" class="glyphicon glyphicon-ok"></i> Ticket used successfully.
            </span>
        </h4>
        <br>
   @endif

这是我提交表单并刷新页面时执行的操作：

foreach ($products as &$item) {
                    $item['price'] = $item['price'] - ($item['price'] * ($ticket->discount / 100));
                }

                Session::put('cart', $products);

---

这一切都可以正常工作，但我不知道如何在不刷新页面的情况下更新值，这样用户就可以查看表单，并且不能再次提交表单

在会话变量检查中包装表单

表格

 <form id="ticket" action="prekiu-uzsakymas" method="get">
                        <input type="text" name="ticket">
                        <input id="btnSubmit" type="submit" value="Panaudoti kuponą">
                    </form>

   @if ( !request()->session()->get('ticket') )
       <form id="ticket" action="prekiu-uzsakymas" method="POST">
           <input type="text" name="ticket">
           <input id="btnSubmit" type="submit" value="Panaudoti kuponą">
       </form>
   @else
        <h4>
            <span class="label label-success">
                <i style="color: white" class="glyphicon glyphicon-ok"></i> Ticket used successfully.
            </span>
        </h4>
        <br>
   @endif

在您的

JavaScript/AJAX

中：

$(document).ready(function(){

            $('#ticket').on('submit',function(e){
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-Token': $('meta[name="csrf_token"]').attr('content')
                    }
                });
                e.preventDefault(e);


                $.ajax({

                    method:"GET",
                    url: $("#ticket").attr("action"),
                    data:$(this).serialize(),
                    dataType: 'html',
                    success: function(data) {
                        var statusHTML = '<h4><span class="label label-success">' +
                                '<i style="color: white" class="glyphicon glyphicon-ok"></i> Ticket used successfuly.</span></h4><br>';

                        $("#ticket").replaceWith(statusHTML);
                    },
                    error:function(data){
                        console.log("request failed");
                    }
                })

            });

        });

   $(document).ready(function(){

       $.ajaxSetup({
           headers: {
               'X-CSRF-Token': $('meta[name="csrf_token"]').attr('content')
           }
       });

       $('#ticket').on('submit',function(e){

           e.preventDefault();

           $.ajax({

               method: $("#ticket").attr("method"),
               url: $("#ticket").attr("action"),
               data:$(this).serialize(),
               dataType: 'html',
               success: function(data) {
                   var statusHTML = '<h4><span class="label label-success">' +
                           '<i style="color: white" class="glyphicon glyphicon-ok"></i> Ticket used successfully.</span></h4><br>';

                   $("#ticket").replaceWith(statusHTML);

                   // data will now contain your products with updated prices
                   // You can access this with: data.products
                   // Example:
                   if (data.products) {
                       $(data.products).each( function(index) {
                           $("#product-"+$(this).id).find(".price").html($(this).price);
                       });
                   }
               },
               error: function(data){
                   console.log("request failed");
               }
           })

       });

   });

$（文档）.ready（函数（）{
$.ajaxSetup({
标题：{
'X-CSRF-Token'：$（'meta[name=“CSRF_Token”]）.attr（'content'）
}
});
$（'#ticket'）。在（'submit'，函数（e）上{
e、 预防默认值（）；
$.ajax({
方法：$（“#票证”）.attr（“方法”），
url:$（“#票证”）.attr（“操作”），
数据：$（this）.serialize（），
数据类型：“html”，
成功：功能（数据）{
var statusHTML=''+
“票证使用成功。
”；
$（“#票证”）。替换为（状态HTML）；
//现在，数据将包含更新价格的产品
//您可以通过以下方式访问：data.products
//例如：
if（数据产品）{
$（data.products）。每个（函数（索引）{
$（“#product-”+$（this.id）.find（“.price”）.html（$（this.price））；
});
}
},
错误：函数（数据）{
console.log（“请求失败”）；
}
})
});
});

---

我还将表单方法修改为POST，这是可选的。如果使用此选项，则需要将routes.php中的路由更改为

route:：post

。否则，您可以使用GET。

U无法执行此操作。至少有两次会议。如果你向我解释你需要什么，我可以建议实现它的正确方法。我想在提交表单时更新显示的价格而不刷新页面。然后你应该像

$（'#price'）.text（）一样更新它。如果你需要使用一系列产品，你需要创建一个函数，该函数将清除所有数据并重新填充。如果你使用AngularJSOk之类的工具会容易得多。好的，提交表单时有其他选择吗？不要让表单在页面刷新后再次提交？你需要使用cookies或html 5缓存之类的工具来保存用户操作并在表单提交前添加检查。谢谢你的努力！我现在遇到这个错误：
prekiu-uzsakymas:263未捕获类型错误：无法读取此行中未定义的属性“each”：数据类型：“html”，嘿，伙计！我做得很好！我最需要的是在会议中使用的商店门票！谢谢你能邀请我聊天吗？我还有一个问题，我添加了一个检查，看看在回答中是否返回了“产品”。我看不到您的整个项目，所以只有您知道$products包含哪些内容，以及通过AJAX响应返回哪些内容。您还可以尝试使用
success:function（response）
，然后将
if（data.products）
更改为
if（response.products）
。