CODEWITHSUNDEEP
javascriptlaravel
Lance Scott
Lance Scott

Reputation: 51

jquery dropdown box based on multiple criteria

I am trying to create a dropdown box that show options based on multiple criteria, I have it filtering results based on the selection of the box above it, but I also want it to only show results based on a field in the database.

For example, you want to allocate a payment, you select the customer in the first box, in the second box it shows the branches and in the third box the invoices for that customer, I would like it to show only the invoices for the customer branch selected and then also only the invoices that are not paid.

I have a field in the database "paid", and the value of this field is either 0 or 1.

I am using laravel, and here is the code I currently have:

 $(document).ready(function () {
    $("#customer").jCombo("{!! url('admin/payments/comboselect?filter=tbl_customers:id:tradingName') !!}", {
        selected_value: '{{ $row["customer"] }}'
    });

    $("#customerBranch").jCombo("{!! url('admin/payments/comboselect?filter=tbl_customerBranches:id:branchName') !!}&parent=customer:", {
        parent: '#customer',
        selected_value: '{{ $row["customerBranch"] }}'
    });

    $("#invoice").jCombo("{!! url('admin/payments/comboselect?filter=tbl_invoice:id:invoiceNumber') !!}&parent=customer:", {
        parent: '#customer',
        selected_value: '{{ $row["invoice"] }}'
    });
});

Any help with this will be greatly appreciated.

Upvotes: 0

Views: 108

Answers (2)

Jenish Shrestha
Jenish Shrestha

Reputation: 234

To only get the invoices of the selected customer branch, you need to keep the parent of the invoice as 'customerBranch'. 

$("#invoice").jCombo({
 url: 'admin/payments/comboselect?filter=tbl_invoice:id:invoiceNumber' ,
 parent: '#customerBranch',
 selected_value : '{{ $row["invoice"] }}'
});

To get the invoices that are not paid you need to update the query adding

->where('paid',0)->get();

Upvotes: 1

Inzamam Idrees
Inzamam Idrees

Reputation: 1981

I have the code for Category and Subcategory dropdown. When you select the category then the selected category shows the subcategory in another dropdown using category_id. Here I am sharing the code and I hope according to below code you can solve your problem easily.

$(document).ready(function() {
    $('select[name="category"]').on('change', function() {
        var categoryID = $(this).val();
        if(categoryID) {
            $.ajax({
                url: "{{ url('/product/subcategory') }}/"+categoryID,
                type: "GET",
                dataType: "json",
                success:function(data) {

                    if(data == "error"){
                        $('select[name="subcategory"]').html('<option value="">Selected Category has No SubCategories</option>').attr("disabled",true);
                    }
                    else{
                        $('select[name="subcategory"]').html('<option value="">Select Sub Category</option>').attr("disabled",false);;
                        $.each(data, function(key, value) {
                            $('select[name="subcategory"]').append('<option value="'+ value.id +'">'+ value.sub_category +'</option>');
                        });
                    }
                }
            });
        }else{
            $('select[name="subcategory"]').html('<option value="">First Select Category</option>').attr("disabled",true);
        }
    });
});

Upvotes: 0

Related Questions