Submit Button Value not available in Request

No need to check if Laravel can see it. Check in developer tools! The Network tab is amazing for checking headers/form data.

I really need to explore the developer tools. I use them a lot, but not to their full potential. I actually never realized I could see form data there.

At any rate, in the dev tools in Chrome, Safari and Firefox the status is not being posted. I realized I have some javascript doing some validation, but the javascript doesn't submit the form, the javascript only sends an e.preventDefault() if there is a missing required field and then displays the message.

I commented out the validation and the post worked with status being available. So now I know where to continue my debugging.

I know what the problem is. I just need to figure out a better solution.

My form has a JQuery event handler

$('#listingForm').submit(function(e){
    e.preventDefault(); // otherwise the form will submit even with errors
    
    // blah blah blah error checking

    if( errors) {
        $('#errorDiv').html(errorMessage).slideDown();
        return false;
    }

    $(this).unbind('submit').submit()
});

So the form is stoping the submission, doing it's error checking and then displaying a message if the error is found. However if there is no error it unbinds that form and then tells it to re-submit. The problem is that now the button being pushed isn't what submitted it, ajax is.

I'll either have to add an onClick handler to the buttons that return true or false (I think that should prevent form submissions if returning false) or I'll have figure out a better way to validate and show errors.

Yeah the network tab is great to quickly see the POST data, saves you checking in the code and trying to dump all the request vars.

Yeah if it's not being sent in the request, PHP has no chance of getting it :P

The reason the status wasn't showing up in the POST is because it wasn't being sent with the POST. Thanks to @bashy and his suggestion to look at the developer tools in chrome I was able to see that.

That led me to my javascript which was doing an e.preventDefault() and then later triggering the submit. So javascript was submitting the form, not the button.

I updated my buttons as such

<button type="submit" name="status" value="Available" class="btn btn-success form-control" onClick="return validate()"><i class="fa fa-fw fa-thumbs-o-up"></i> Publish</button>
     <button type="submit" name="status" value="Draft" class="btn btn-danger form-control" onClick="return validate()"><i class="fa fa-fw fa-sign-out"></i> Save Draft</button>

I then extracted my validation from a jquery onSubmit handler to the validate function. By simply having the validate function return false, it would prevent the form from being submitted allowing the errors to show. By having the validate function return true it let the form submit as normal and the value of the button used is passed.

SPECIAL NOTE

Whenever I submit a form I like to add a disabled attribute to the form buttons so that someone can't click it if they have a slow connection or if the response is taking too long. I generally replace the button text with an ajax style spinning icon and then replace the button text if needed and remove the disabled attribute if needed in case there are form errors.

I noticed return true did not work if I kept the disabled attribute on the button. Just an FYI in case anybody else tries that.