Jump to content
funstad

Javascript passing checkbox values to PHP

Recommended Posts

Hello,

 

I have created a java-script file which needs to see which check-boxes are checked and pass it to PHP

 

Testing platform:

Url: https://crezzur.com/test/backoffice/
Login: test@w3schools.com
Pass: w3school

 

When logged in go to the name " height " then next the "view" button click on the arrow and select "edit".

there you will see a checkbox tree called "Available categories".

So i need to find whats the issue for my JavaScript code not working.

When you select a checkbox for example "Women" it should pass the variable to my php code when pressing on the save button.

 

PHP code:

        if (Tools::isSubmit('activeOnCats')) {
            require_once(_PS_MODULE_DIR_.'featuresincategory/featuresincategory.php');
            $fcat = new FeaturesInCategory();
            $fcat->setFeatureCategories(Tools::getValue('activeOnCats'), Tools::getValue('id_feature'));
        }

Anyone with some JavaScript knowledge could take a look at my issue?

Share this post


Link to post
Share on other sites

The first issue I'm finding is a browser security issue. It's refusing to load jQuery because you're using http instead of https, but it looks like there's another jQuery library already loaded on the page, so it's most likely a good thing that jQuery 1.7 isn't loading.

 

The save button redirects to another page, so it doesn't look like there's any time for the Javascript to run. Can you show your Javascript code?

Share this post


Link to post
Share on other sites

The first issue I'm finding is a browser security issue. It's refusing to load jQuery because you're using http instead of https, but it looks like there's another jQuery library already loaded on the page, so it's most likely a good thing that jQuery 1.7 isn't loading.

 

The save button redirects to another page, so it doesn't look like there's any time for the Javascript to run. Can you show your Javascript code?

 

hello, this is my javascript file:

fcat = {
    initCatSelection: function () {
        $('#feature_form_submit_btn').on('click', fcat.overrideSubmit);
        $('.restoreButton > a').on({
            mouseenter: fcat.switchRestore,
            mouseleave: fcat.switchRestore,
            click: fcat.restoreActiveCategories,
        });
        fcat.selectActiveCategories();
    },
    selectActiveCategories: function () {
        var iniCat = $('#activeCategories').attr('initial_categories');
        
        if (iniCat !== '' && iniCat !== null) {
            var catArr = iniCat.split(',');
            for (var a in catArr) $('input[type=checkbox][value="CAT'+catArr[a]+'"]').prop('checked',true);
        }
    },

    overrideSubmit: function (e) {
        var cats = fcat.extractActives();
        
        if (cats.length > 0) {
            cats.sort();
            
            var str = cats.join(',');
            $('<input>').attr({
                type: 'text',
                value: str,
                style: 'display: none',
                name: 'activeOnCats',
            }).insertAfter($('#activeCategories'));
        }
        
        else {
                alert('Error: You have to select atleast 1 category.');
                e.preventDefault();
                return false;
        }
        
        //Continue normal Submit
    },
    extractActives: function () {
        var categs = [];
        $('input[name="option"]:checked').each(function() {
            if($(this).is(':checked'))
                categs.push(fcat.getCatID($(this).attr('value')));
        });
        return categs;
    },
    getCatID: function (mix) {
        return parseInt(mix.replace('CAT', ''));
    },
    switchRestore: function () {
        $('i', $(this)).toggleClass('icon-spin');
    },
    select: function (option, bool) {
        $(option)[0].selected = bool;
    },
    unselect: function () {
        fcat.select(this, false);
    },
};

$(document).ready(fcat.initCatSelection);

      jQuery.fn.multiselect = function() {
    $(this).each(function() {
        var checkboxes = $(this).find("input:checkbox");
        checkboxes.each(function() {
            var checkbox = $(this);
            if (checkbox.prop("checked"))
                checkbox.parent().addClass("aangeduid");
                checkbox.click(function() {
                if (checkbox.prop("checked"))
                    checkbox.parent().addClass("aangeduid");
                else
                    checkbox.parent().removeClass("aangeduid");
            });
        });
    });
};
Edited by funstad

Share this post


Link to post
Share on other sites

Rather than using the click event of the button, I would use the submit event of the form.

$('#feature_form').on('submit', fcat.overrideSubmit);

But why is Javascript necessary? PHP should be able to pick up the form inputs without the need for Javascript.

 

The network tools tell me that activeOnCats is being sent to the server side, so debugging needs to be done on the PHP side. I'd start by printing out the values that are being received:

echo Tools::getValue('activeOnCats'); exit;

Share this post


Link to post
Share on other sites

 

Rather than using the click event of the button, I would use the submit event of the form.

$('#feature_form').on('submit', fcat.overrideSubmit);

But why is Javascript necessary? PHP should be able to pick up the form inputs without the need for Javascript.

 

The network tools tell me that activeOnCats is being sent to the server side, so debugging needs to be done on the PHP side. I'd start by printing out the values that are being received:

echo Tools::getValue('activeOnCats'); exit;

 

I need the JavaScript part because i need to use a override controller on prestashop.

 

I think my activeOnCats values are not send from JavaScript to PHP.

 

Share this post


Link to post
Share on other sites

I just checked and they are getting sent. In most browsers you can open developer tools using F12. In the "net" or "network" tab it shows what is being sent to the servers. If there's a "persist" button you should click on it, since it clears the console when a new page is loaded and the server-side code is redirecting after the POST request is received.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...