ajax调用后获取旧数据（get方法）Laravel 5.5

我在页面上使用两个ajax调用：在页面的一侧，我使用ajax post发布数据并在数据库中提交颜色（表名：color_store），另一方面，我尝试从该表中获取所有颜色，并通过单击按钮将其置于选择标记中。但即使提交新颜色，我仍然会收到旧数据。ajax调用后获取旧数据（get方法）Laravel 5.5

这里是我的颜色提交表单：

<form method="post" action="/CRM/defineColor" id="colorPickingForm"> 

     <input id="colorName" name="colorName" type="text"> 
     <button type="button" class="btn blue" id="addColor">submit</button> 

    </form>

这里是我的ajax到颜色提交到数据库：

$('#addColor').click(function(){ 
      $.ajaxSetup({ 
       headers: { 
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
       } 
      }); 

      var colorName = $('#colorName').val(); 

      $.ajax({ 
       url: "/CRM/defineColor", 
       type:"POST", 
       data:{ colorName: colorName}, 
       success: function(data) { 
         $("#result").empty().append(data) 
        } 
       })

这里是选择标签和按钮显示数据：

<select class="form-control" id="colorFetch"> 

    </select> 
    <button type="button" class="btn red" id="colorRefresh">Color Update</button>

这里是AJAX调用获取所有的颜色：

$.ajax({ 
       url: "/CRM/fetchColor", 
       type:"get", 
       dataType: "json", 
       cache: false, 
       contentType:"application/json; charset=utf-8", 
       success: function(colorNameReq) { 


        $("#colorRefresh").click(function(){ 

//loop through json object 
         $("#colorFetch").empty(); 
         $.each(colorNameReq, function(key, value) { 


          $('#colorFetch') 
           .append($("<option></option>") 
            .attr({ 
             id:key, 
             value:value 
            }) 
            .text(value)); 

         }); 

        }); 
       } 
      })

这里是我的控制器，得到所有的颜色数据库：

 protected function fetchColor(){ 


     $colorInfo = new Color_store; 
     $colorInfo = $colorInfo->get(); 
     $count = count($colorInfo); 

     for($i = 0 ; $i < $count; $i++){ 
      $colorName[] = $colorInfo[$i]->colorName ; 
     } 

     $colorName=json_encode($colorName); 

     return $colorName; 
    }

那么，为什么我收到甚至在将颜色提交到数据库之后，JSON对象的旧值？我真的不明白，是不是ajax想给我新的数据？

例如：当我加载页面并按下“颜色更新”按钮时，它会显示我以前提交的两种颜色（红色和绿色）。但是当我向数据库提交新颜色时，让我们说黄色。按下“颜色更新”按钮后，它会再次显示红色和绿色，但列表中没有显示黄色。是不是假设在列表中显示新的颜色（红色，绿色和黄色）？

任何帮助，将不胜感激！

来源

2017-11-25 Salar Bahador

@Sahand Khodaparast –

您的JavaScript的第二块创建一个Ajax请求（大概在页面加载）。如果你想在点击按钮时发出新的请求，那么ajax调用应该在点击处理程序中完成，而不是像你现在所做的那样。 – Steve

@Steve哦！谢谢你，你其实是对的。 **我还有一个问题**，我怎样才能设置间隔计时器到该Ajax调用，以便每2秒加载颜色表的内容，并且不要一遍又一遍地重复颜色？我想只更新列表。 –

您的颜色加载AJAX调用似乎不正确。它应该如下：

$("#colorRefresh").click(function(){ 
     $.ajax({ 
       url: "/CRM/fetchColor", 
       type:"get", 
       dataType: "json", 
       cache: false, 
       contentType:"application/json; charset=utf-8", 
       success: function(colorNameReq) { 

        //loop through json object 
         $("#colorFetch").empty(); 
         $.each(colorNameReq, function(key, value) { 


          $('#colorFetch') 
           .append($("<option></option>") 
            .attr({ 
             id:key, 
             value:value 
            }) 
            .text(value)); 

         }); 
       } 
     }); 
    });

并确保您添加的新颜色是否已成功写入数据库。

此外，您可以使用设置间隔函数来检查给定时间间隔内的颜色更新。这将是这样的：

setInterval(function(){ 
$.ajax({ 
        url: "/CRM/fetchColor", 
        type:"get", 
        dataType: "json", 
        cache: false, 
        contentType:"application/json; charset=utf-8", 
        success: function(colorNameReq) { 

         //loop through json object 
          $("#colorFetch").empty(); 
          $.each(colorNameReq, function(key, value) { 


           $('#colorFetch') 
            .append($("<option></option>") 
             .attr({ 
              id:key, 
              value:value 
             }) 
             .text(value)); 

          }); 
        } 
      }); 
}, 2000); //This would check and update in every 2 seconds.

来源

2017-11-26 09:51:46 Anjana

ajax调用后获取旧数据（get方法）Laravel 5.5

回答

相关问题