if/else in php script not working on ajax request

Question

I'm working on a website with heavy Ajax, and I'm using codeigniter for building it.
I've got a form with post method, and this form is being posted using ajax request which call a function with if/else statement, like this:

    if(isset($_POST['save']))
    {
        $data['phase'] = 'translating';
    }
    elseif(isset($_POST['submit']))
    {
        $data['phase'] = 'waiting_approve';
    }

The if/else statement check which button is being clicked, and it works 100% after posting the data of the form in the usual way, but never works when posting it using ajax request.
My ajax request:

    $('#workspace-content').delegate('form#article', 'submit', function(){
    var that = $('form#article'),
        url = that.attr('action'),
        type = that.attr('method'),
        data = {};

        data = that.serialize();

        $.ajax({
            type: type,
            url : url,
            data : data,
            dataType: 'json',

            success: function(data){
                $('#header-search-field').append(data.msg).delay(3000).fadeOut(500, function(){
                    var that = $(this);
                    that.html('').fadeIn();
                });
            }
        });

    return false;
});

Any suggestion or solution?!!

The HTML form:

<button id="save-article" type="submit" name="save" class="btn btn-info btn-xs pull-left">
    <span class="glyphicon glyphicon-floppy-save"></span>
</button>
<input name="title" type="text" value="<?php echo $work->title;?>" class="form-control" id="title" placeholder="" />
<textarea row="10" name="article" class="form-control" id="article" placeholder=""><?php echo $work->article;?></textarea>
<button id="submit-article" type="submit" name="submit" class="btn btn-info btn-block">Send</button>
<input name="slug" type="hidden" value="<?php echo $work->slug;?>" />

I don't usually work with jQuery, but you could try debugging it with var_dump($_POST); and possibly trying var_dump($_REQUEST); just so you can see what's going on. — Spencer D
– Spencer D, Commented Jan 1, 2016 at 0:58
What's the data being sent in the request? Seems like that would be relevant... — David
– David, Commented Jan 1, 2016 at 1:00
Make sure that the type is POST not GET. By the way, in CodeIgniter, use &get_instance()->input->post() instead of $_POST. — Damodar Dahal
– Damodar Dahal, Commented Jan 1, 2016 at 1:14
that.serialize doesn't include the button that the user clicked on to submit the form. — Barmar
– Barmar, Commented Jan 1, 2016 at 1:28

Barmar · Accepted Answer · 2016-01-01 01:56:20Z

1

When you submit a form normally, the button that you used to submit it will be included in the POST data. But when you submit with AJAX, and use that.serialize(), the POST data just includes the input fields -- the submit button isn't included. You need to attach your submit code to the buttons, so you can add the appropriate values to the data.

$('#workspace-content').on('click', 'form#article .btn', function(){
    var that = $(this).closest("form"),
        url = that.attr('action'),
        type = that.attr('method'),
        data = that.serialize();
    data += '&' + this.name + '=1';

    $.ajax({
        type: type,
        url : url,
        data : data,
        dataType: 'json',

        success: function(data){
            $('#header-search-field').append(data.msg).delay(3000).fadeOut(500, function(){
                var that = $(this);
                that.html('').fadeIn();
            });
        }
    });

    return false;
});

edited Jan 1, 2016 at 1:56

answered Jan 1, 2016 at 1:35

Barmar

789k57 gold badges554 silver badges669 bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

MAZux Over a year ago

I tried this also:

that.find('[name]').each(function(name, value){ 				var thisInput = $(this); 				name = thisInput.attr('name'); 				value = thisInput.val();  				data[name] = value; 			});

but there's the 2 buttons' names with no values :\ . any other suggestions?

Barmar Over a year ago

Buttons don't have a value, I took that out of my answer. They just have a name.

Barmar Over a year ago

data[name] = value won't work, because data is a string, not an array.

Spooky Over a year ago

@Barmar Buttons can/should have values and it's quite good practice to attach a value to a button, especially if there are multiple buttons with same type and name, but different values.

Barmar Over a year ago

True, but in his form his buttons don't have values, he's just distinguishing them by name.

|

Collectives™ on Stack Overflow

if/else in php script not working on ajax request

1 Answer 1

10 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

10 Comments

Your Answer

Sign up or log in

Post as a guest

Related