通过Laravel中的javascript获取信息

时间:2018-07-30 01:03:24

标签: javascript php html laravel eloquent

我正在尝试通过javascript从第二个表中获取特定列,并将其数据返回到我的视图中,但是我不确定该怎么做。

逻辑

  1. 产品表具有price
  2. 折扣表具有product_idminmaxamount
  3. 如果折扣表中有产品ID,我将输入数量作为数量 基于minmax返回amount作为新价格

代码

到目前为止,这是我的代码(我知道我的控制器方法特别具有识别问题,无法找到正确的数据)

JavaScript

<script>
  $(document).ready(function() {
    // if quantity is not selected (default 1)
    $('#newprice').empty();
    var quantity =  parseInt(document.getElementById("quantity").value);
    var shipingcost = parseFloat(quantity);
    var shipingcostnumber = shipingcost;
    var nf = new Intl.NumberFormat('en-US', {
        maximumFractionDigits:0, 
        minimumFractionDigits:0
    });
    $('#newprice').append('Rp '+nf.format(shipingcostnumber)+'');

    // if quantity is changed
    $('#quantity').on('change', function() {
      var quantity = parseInt(document.getElementById("quantity").value);
      var qtyminmax = $(this).val();
      if(qtyminmax) {
        $.ajax({
          url: '{{ url('admin/qtydisc') }}/'+encodeURI(qtyminmax),
          type: "GET",
          dataType: "json",
          success:function(data) {
            $('#totalPriceInTotal').empty();
            var shipingcost = parseFloat(data)+parseFloat(quantity);
            var shipingcostnumber = shipingcost;
            var nf = new Intl.NumberFormat('en-US', {
                maximumFractionDigits:0, 
                minimumFractionDigits:0
            });
            $('#totalPriceInTotal').append('Rp '+nf.format(shipingcostnumber)+'');
          }
        });
      }else{
        //when quantity backs to default (1)
        $('#newprice').empty();
        var quantity = parseInt(document.getElementById("quantity").value);
        var shipingcost = parseFloat(quantity);
        var shipingcostnumber = shipingcost;
        var nf = new Intl.NumberFormat('en-US', {
            maximumFractionDigits:0, 
            minimumFractionDigits:0
        });
        $('#newprice').append('Rp '+nf.format(shipingcostnumber)+'');
      }
    });
  });
</script>

Route

Route::get('qtydisc/{id}', 'ProductController@qtydisc');

Controller

public function qtydisc($id){
      return response()->json(QtyDiscount::where('min', '>=', $id)->orWhere('max', '<=', $id)->pluck('min'));
    }

问题

  1. 我应该如何更改控制器方法以获得正确的数据?
  2. 我应该在JavaScript代码中进行哪些更改?我应该在路线中也添加product ID还是...?

更新

我正在尝试对代码进行一些更改,但是无法正确使用amount

controller

public function qtydisc($id, $qty){
      $price = DB::table('qty_discounts')
              ->where('product_id', $id)
              ->where([
                  ['min', '>=', $qty],
                  ['max', '<=', $qty],
              ])
              // ->where('min', '>=', $qty)
              // ->where('max', '<=', $qty)
              ->select('amount')
              ->first();
      return response()->json($price);
    }

route

Route::get('qtydisc/{id}/{qty}', 'ProductController@qtydisc');

javascript

//as before...

$('#quantity').on('change', function() {
      var idofproduct = ["{{$product->id}}"]; //added
      var quantity = parseInt(document.getElementById("quantity").value);
      var qtyminmax = $(this).val();
      if(qtyminmax) {
        $.ajax({
          url: '{{ url('admin/qtydisc') }}/'+idofproduct+'/'+encodeURI(qtyminmax), //changed
          type: "GET",
          dataType: "json",
          success:function(data) {
            $('#totalPriceInTotal').empty();
            var shipingcost = parseFloat(data)+parseFloat(quantity);
            var shipingcostnumber = shipingcost;
            var nf = new Intl.NumberFormat('en-US', {
                maximumFractionDigits:0, 
                minimumFractionDigits:0
            });
            $('#totalPriceInTotal').append('Rp '+nf.format(shipingcostnumber)+'');
          }
        });
      }else{
//rest of it as before

屏幕截图

screenshotdb

这就是我的数据库的样子,作为26之间数量的结果,我得到7000,而我必须从5000得到2 5

从数字79,我什么都没有得到。

从数字107000

有什么主意吗?

5 个答案:

答案 0 :(得分:2)

主要问题来自您的雄辩陈述,您应该在两种情况下都使用>=辅助函数,并使用OR辅助函数来使用orWhere,所以应该像这样:

$price = QtyDiscounts::where('product_id', $id)
    ->where('min', '>=', $qty)
    ->orWhere('max', '>=', $qty)
    ->pluck('amount')
    ->first();

但是您确实需要看一下您的JS结构,我建议将您的代码拆分为DRY概念的函数,首先是这样的事件侦听器:

$('body').off('input', '#quantity').on('input', '#quantity', function () {
    var qty = parseInt( $(this).val() );

    if(qty) {
        getAmount(qty);
    }else{
        getAmount(1);
    }
});

然后帮助函数调用:

function setValue(quantity, amount)
{
    var newPrice = $('#newprice');
    var totalPrice = $('#totalPriceInTotal');

    newPrice.empty();
    totalPrice.empty();

    var nf = new Intl.NumberFormat('en-US', {
        maximumFractionDigits:0,
        minimumFractionDigits:0
    });

    newPrice.val('Rp '+nf.format(amount)+'');
    totalPrice.val('Rp '+nf.format(parseFloat(amount)*parseFloat(quantity))+'');
};

function getAmount(quantity)
{
    var url = $('#qty_url').val();
    var productId = $('#product_id').val();

    $.ajax({
        url: url+'/'+productId+'/'+encodeURI(quantity),
        type: "GET",
        dataType: "json",
        success:function(amount) {
            setValue(quantity, amount);
        }
    });
};

我想您有一个简单的HTML结构,因此它应该可以这样工作,为什么我建议在这里不要在JS代码中直接使用urlproduct_id之类的php变量,而是附加一个您想要隐藏输入并使用JS获取这些输入的值的值:

<input type="hidden" id="qty_url" value="{{ url('admin/qtydisc') }}" />
<input type="hidden" id="product_id" value="{{ $product->id }}"/>

答案 1 :(得分:0)

在后端控制器中使用相反的条件:

$price = DB::table('qty_discounts')
          ->where('product_id', $id)
          ->where('min', '<=', $qty)
          ->where('max', '>=', $qty)
          ->select('amount')
          ->first(); 

因此,对于$id = 2和$qty = 5,您将得到

product id = 2  and `min` <= 5 and `max` >= 5

选择第一行(row_id = 1)

答案 2 :(得分:0)

停止将JavaScript与jQuery混合,而不是

var quantity = parseInt(document.getElementById("quantity").value);

你可以做

var quantity = +$('#quantity').val();

并希望即使在旧版Internet Explorer中也能使用

走得更远

路线

Route::get('/ajax/product/{product}/distcounts', 'AjaxController@productDiscounts);

HTML

<input type="number" name="quantity" data-product_id="{{ $product->getKey() }}">

PHP

public function productDiscounts(Product $product, Request $request) {
    // $product is just a product you are interested in
    // $request->quantity containts passed amount

    $discounts = DiscountModel::product(     // Scope
        $product->getKey()
    )
    ->get()
    ->filter(function($element) use($request) {
        return ($element->min <= $request->quantity && $element->max >= $request->quantity);
    })
    ->values();

    return response->json(discounts);
}

JavaScript

(function($) {
    var getDiscountAmount(e) {
        var $input      = $(e.target);
        var product_id  = $input.data('product_id');

        $.ajax({
            method: 'GET',
            url: '/ajax/product/' + product_id + '/discount',
            data: {
                quantity: $input.val()
            },
            beforeSend: function() {
                $input.prop('disabled', true);
            },
            success: function(discounts) {
                $input.prop('disabled', false);

                // Dunno what you want to do with list of discounts right there
                // It should be an array containing 1 object, but who knows
            }
        })
    }

    $(input[name="quantity"]).on('change', getDiscountAmount);
})(jQuery);

希望它会有所帮助,没有测试代码,因此您可能需要进行一些调整

答案 3 :(得分:0)

如果您遇到从控制器到JS共享数据的情况,那么我建议使用此软件包JsTransformers。它使您可以执行以下操作

// in controller
public function index()
{
    JavaScript::put([
        'foo' => 'bar',
        'user' => User::first(),
        'age' => 29
    ]);

    return view('index');
}

// in view scripts
console.log(foo); // bar
console.log(user); // User Obj
console.log(age); // 29

答案 4 :(得分:0)

您应该这样编写查询:

public function qtydisc($id, $qty){
      $price = DB::table('qty_discounts')
              ->where('product_id', $id)
              ->where($qty, '>=', 'min')
              ->where($qty, '<=', 'max')
              ->select('amount')
              ->first();
      return response()->json($price);
    }