CODEWITHSUNDEEP
phpjavascriptmysqlajax
Darren Burgess
Darren Burgess

Reputation: 4312

Add to mysql with checkbox and AJAX

I have some data which will be displayed like this;

foreach ($holidays as $holiday) 
            {
                $resultTable .=  "<p><a href=\"{$holiday->link}\">{$holiday->title}</a>" . "<br/>" . 
                "{$holiday->pubDate}" . "<br>" . 
                "{$holiday->description}" . "<input type=\"checkbox\" name=\"saveCB\" value=\"3\"/>" . "<br /></p>";                

            }

Is there an easy way by which when the checkbox is clicked and the data would be added to a mysql table using AJAX?

Regards Darren

Upvotes: 0

Views: 773

Answers (3)

Esben Tind
Esben Tind

Reputation: 885

Yes you need javascript to do this. It can be done pretty easily though, if you are satisfied with the form submitting, and the page refreshing each time a select box is changed (i.e. check/unchecked). If you can't accept this, you'll have to use ajax. That would be your optimal solution, and easy as ajax is, it is a nice to have in your toolbox for future projects.

That said, you can achieve this by giving your form an id attribute, and paste this javascript just beneath your form (and edit the form id var):

<script type="text/javascript">
    var formId = "YOUR FORM ID HERE";
    function submitForm(){document.getElementById(formId).submit()}
</script>

Then add the following attribute to each checkbox: onchange="submitForm()".

Again, it is highly recommended to use ajax for this sort of stuff, and if you look into jQuery ajax, you'll be impressed how easy this can be done.

EDIT: What you can do to actually implement this in your existing code (replace it):

<form action="php-file-to-process-form.php" id="your-form-id" method="post">
    <?php if(count($holidays)>0): foreach($holidays as $holiday): ?>
    <p>
        <a href="<?php echo $holiday->link; ?>"><?php echo $holiday->title; ?></a>
        <br>
        <?php echo $holiday->description; ?>
        <input type="checkbox" name="saveCB[<?php echo $holiday->id; ?>]" value="<?php echo $holiday->id; ?>">
    </p>
    <?php endforeach; endif; ?>
</form>
<script type="text/javascript">
    var formId = "your-form-id";
    function submitForm(){document.getElementById(formId).submit()}
</script>

Please note i rewrote parts of your code. But in this case, assuming your $holiday objects has an "id" property, php-file-to-process-form.php should receive a fairly comprehensible post request.

Upvotes: 2

davidethell
davidethell

Reputation: 12018

To avoid page refreshing with a form submit you'll want to use AJAX. You didn't tag your question as using jquery, but I highly recommend it. Here is a jQuery example of what you want:

$('input[type=checkbox]').click(function() {
    if ($(this).is(':checked')) {
        var name = $(this).attr('name');
        var value = $(this).val();
        $.post('/path/to/your/php/code', {name: value}, function(data){
            //Handle the result of your POST here with data containing whatever you echo back from PHP.
        });
    }
});

Note that this puts the same click handler on all your checkboxes which might be the wrong assumption. If you have other checkboxes on your form that you don't want to use with this logic you'd just need to change the jQuery selector from 'input[type=checkbox]' to something more restrictive such as inputs that have a certain css class.

Upvotes: 0

Bono
Bono

Reputation: 4849

PHP doesn't have onClick events, you would have to use JavaScript for something like that.. Or make it so you post your values with PHP (using a form), then it would be possible.

Upvotes: 0

Related Questions