Selecting Laravel lists by month option

I'm encountering a problem here. The error message reads "Too few arguments to function App\Http\Controllers\ViewsController::OBviews(), 0 passed and exactly 1 expected"

Here is my controller:

 public function OBviews($date)
    {
        $masterIds = DB::select('SELECT * FROM o_b_masters OBM INNER JOIN users u on OBM.emp_id = u.id INNER JOIN o_b_requests OBR 
        on OBR.details_id = OBM.obmaster_id WHERE u.id =? AND MONTH(OBM.date_filed) = ?', [Auth::id(), $date]);

         return response()->json($masterIds); 
    }

This is my route:

Route::GET('/obView/{date}', 'ViewsController@OBviews')->name('OBRequest');

Below is the JavaScript code:

 $('select').on('change', function (e) {
var optionSelected = $("option:selected", this);
var valueSelected = this.value;
  alert(valueSelected);
    $.ajax({
            url: 'obView',
            type: 'GET',
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            data: 'date='+valueSelected,
            success: function (data) {
                if (data['success']) {
                    alert(data['success']);
                } else if (data['error']) {
                    alert(data['error']);
                } else {
                    alert('Whoops Something went wrong!!');
                }
            },
            error: function (data) {
                alert(data.responseText);
            }
        });
  });

In my details.blade.php file:

  <select name="month" class="form-control">
    <option value="01">January</option>
    <option value="02">February</option>
    <option value="03">March</option>
    <option value="04">April</option>
    <option value="05">May</option>
    <option value="06">June</option>
    <option value="07">July</option>
    <option value="08">August</option>
    <option value="09">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
  </select>

It appears that when there are changes, nothing gets passed to the controller.

Answer №1

Your URL is expecting a date segment, but in your AJAX call, you did not specify the date segment.

To fix this issue, update your code like so:

 $('select').on('change', function (e) {
var optionSelected = $("option:selected", this);
var valueSelected = this.value;
  alert(valueSelected);
    $.ajax({
            url: 'obView/' + valueSelected,
            type: 'GET',
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            success: function (data) {
                if (data['success']) {
                    alert(data['success']);
                } else if (data['error']) {
                    alert(data['error']);
                } else {
                    alert('Whoops Something went wrong!!');
                }
            },
            error: function (data) {
                alert(data.responseText);
            }
        });
  });

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Bringing in a feature within the Vue 3 setup

At the moment, I am attempting to utilize a throttle/debounce function within my Vue component. However, each time it is invoked, an error of Uncaught TypeError: functionTD is not a function is thrown. Below is the code snippet: useThrottleDebounce.ts imp ...

Using ObjectIDs in MongoDB may be successful, however, it may not function properly in Mongoose

The desired effect is successfully achieved by the first code snippet shown below: //in mongodb console: db.collection.update({"username":"name"}, {$pull : { "task" : { "_id" : ObjectId("55280205702c316b6d79c89c")}}}) However, the second code snippet wri ...

"The FindByIdAndUpdate function is successfully updating the data, but it is unexpectedly

This is my first time seeking guidance here, as I've reached a dead end with my issue. I am currently working on a household collection that includes a member collection within it. Whenever new members join, I need to update the household collection ...

The read more button is not functioning properly when used in conjunction with the <br>

Can someone help me debug an issue I'm facing with my code? I have created an HTML tab that contains multiple DOM elements, each with a "Read More" button. Everything works fine when it's just plain text, but as soon as I add tags within the p ...

Expressjs Error- ReferenceError: cors has not been defined in this context

While working on creating a backend using ExpressJs, I encountered an error when running the backend. app.use(cors()) ^ ReferenceError: cors is not defined at Object.<anonymous> (C:\Users\hp\Desktop\Entri\kanba\ ...

Leveraging Vue slots to display a component inside another component

I am currently working on creating a base modal component that can be re-used, utilizing slots to insert the modal content. The issue I am facing is that when the modal is triggered by clicking a button, it displays without any content present. How can I e ...

From Google Assistant to Python Results

Is there a way to control a Bitcraze Crazyflie drone using Google Home? I'm looking to give the command "Drone fly to x3 y4" which will be processed through Firebase and result in the Google Assistant Output: "Flying to x3 y4". Additionally, I need an ...

The React Native SearchBar is throwing an error: It is stating that the prop type `value` being passed to `ForwardRef(TextInput)` is invalid. The expected type is `string`, but

I'm completely lost with this error message. Everything was running smoothly a while back, and I haven't made any changes to this code. When I returned to this page recently, I was greeted with the following error: Failed prop type: Invalid prop ...

Error alert: Blinking display, do not dismiss

I am trying to make it so that when the "enviar" button is clicked, the "resultado" goes from being hidden ("display:none") to being visible ("display:block"). This is my html document: <script type="text/javascript"> function showResu ...

Steps for organizing a list based on the number of clicks

I've created an HTML list with images of political party logos. Each logo is a grid item that can be clicked on. I want to sort the list based on the number of clicks each logo receives, essentially ranking them by popularity. However, I'm not su ...

Angular 6 - The state of the expression was altered after it was verified, different types of constructions

During the build process in debug mode with ng build, I am encountering errors in some components. However, when I switch to production mode using ng build --prod, these errors disappear. I am curious as to why this discrepancy is occurring. Error: Expre ...

Switching between light and dark themes in a Next.js application with Ant Design v5 theme toggle

In my Next.js application using Ant Design v5, I am working on implementing a dynamic theme toggle to switch between light and dark modes. The issue I'm facing is that the initial theme settings work correctly, but subsequent changes to the isDarkMode ...

A guide on implementing Angular ngbPopover within a CellRenderer for displaying in an ag-grid cell

I successfully set up an Angular Application and decided to utilize ag-grid community as a key component for displaying data from a backend API in tables, using fontawesome icons to enhance readability. While everything looks fine and my application is fu ...

Issue with radio button functionality while iterating through loop

I am currently working on a form where users are required to select one answer from each question using radio buttons. The loop logic allows for the selection of one answer per question. <form method="POST" action="{{url('quiz/check')}}" {!! ...

Node Js seems to be taking quite a while to output to the console

Hello, this is my first time posting on Stack Overflow so please bear with me if I make any mistakes. I created a button that, when clicked, decrements the quantity by one. After updating the UI, I send the data to the server. However, when I console log t ...

Locating the Smallest Value in an Array of Objects

Looking at an object with keys containing arrays of objects that each have a price value. The goal is to find and return the lowest price value. In this scenario, aiming to return the value 8. Wondering if using the reduce method would be the best approach ...

The instance is referencing "underscore" during render, but it is not defined as a property or method

I have experience as a skilled react developer, but I've taken over a vue.js project from another developer and managed it for quite some time. Regrettably, I haven't put in the effort to learn vue properly. When using lodash, I encountered an u ...

"Encountered an undefined error with the title property of this.state.project in the Wordpress API

I'm currently working on a project that involves a Backend Wordpress and a front-end React setup. However, I've encountered an issue when attempting to retrieve the title.rendered from the JSON Data. This error is displayed: TypeError: this.sta ...

FireFox is causing issues with both ng-view and Angular functions, rendering them unusable

My AngularJS sample application is running smoothly in Google Chrome, but when I tried to test it in Firefox, I encountered issues with ng-view and other functions not working properly. This is the structure of my application: Index.html <!DOCTYPE ht ...

Failed to fully install all dependencies for my project with yarn install

After cloning a project from gitlab, I attempted to install the dependencies using the yarn install command. However, there are several dependencies that yarn is unable to install and it keeps showing the error message: info There appears to be trouble wit ...