Form only submits with Enter key

Navigation
2

Inside the backoffice of a store based on Prestashop V.1.6.1.3.

When I try to register a product, a very strange problem occurs that does not show error in anything even using the debug mode connected: 

define('_PS_DEBUG_DEV_', true);
define('_PS_MODE_DEV_', true);

Problem: When I select the submit button, using tab navigation and click on ENTER, it submits the form, but when I click the button it does not send the form .

Considerations: When I'm using Fedora Linux, with Chrome Version 52.0.2743.82 (64-bit), the form submits with a click and saves the product without problems. However, when I submit the form using virtualbox, with Windows 7, with the most current Chorme: 54.0.2840.59, it simply only saves the product after the fifth attempt with (click) or through tab until you reach the button and press " ENTER ".

The strange thing is that even if you erase your entire browser cache, and testing on multiple machines with "windows 7, windows 8 and windows 10 ..." this error occurs, only using Firefox on Windows and on my Linux did not present this problem. This is very strange behavior ... So I have no idea what this error could be, and I have no idea how I could fix the problem.

Code:

This is the head of the form: 

<form id="product_form" class="form-horizontal col-lg-10 col-md-9" action="index.php?controller=AdminProducts&amp;token=9aa71815d1823d502542e0ddedffdcdb&amp;addproduct" method="post" enctype="multipart/form-data" name="product" novalidate="novalidate">

And these are the footer buttons: 

<div class="panel-footer">
    <a href="index.php?controller=AdminProducts&amp;token=9aa71815d1823d502542e0ddedffdcdb" class="btn btn-default"><i class="process-icon-cancel"></i> Cancelar</a>
    <button type="submit" name="submitAddproduct" class="btn btn-default pull-right"><i class="process-icon-save"></i> Salvar</button>
    <button type="submit" name="submitAddproductAndStay" class="btn btn-default pull-right"><i class="process-icon-save"></i> Salvar e permanecer</button>

Excerpt from admin.js javascript: 

function bindSwapSave()
{
    if ($('#selectedSwap option').length !== 0)
        $('#selectedSwap option').attr('selected', 'selected');
    else
        $('#availableSwap option').attr('selected', 'selected');
}

function bindSwapButton(prefix_button, prefix_select_remove, prefix_select_add)
{
    $('#'+prefix_button+'Swap').on('click', function(e) {
        e.preventDefault();
        $('#' + prefix_select_remove + 'Swap option:selected').each(function() {
            $('#' + prefix_select_add + 'Swap').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");
            $(this).remove();
        });
        $('#selectedSwap option').prop('selected', true);
    });
}

/** make sure that all the swap id is present in the dom to prevent mistake **/
    if (typeof $('#addSwap') !== undefined && typeof $("#removeSwap") !== undefined &&
        typeof $('#selectedSwap') !== undefined && typeof $('#availableSwap') !== undefined)
    {
        bindSwapButton('add', 'available', 'selected');
        bindSwapButton('remove', 'selected', 'available');

        $('button:submit').click(bindSwapSave);

    }

PS: This shop uses smarty .

The normal behavior was when you click, save, and display a success message. But even leaving the required fields blank, he did not even validate. And in the console, even with Javascript enabled. It looks like witchcraft.

See the image as it is being sent without a code error, but do not submit: AndthisisinFedoraLinux,whichsubmitsnormal:

  

Newinformation:  Ijustfoundoutthatitistheiconofthefloppydiskthatisoverlayingthebutton.

    
asked by anonymous 11.11.2016 / 20:00

2 answers

6

I solved the problem as follows: 

.bootstrap .btn.btn-default i {
 color:#555,
 pointer-events:none; /* aqui retiro qualquer evento no ícone */ 
}
    
16.11.2016 / 14:17
2

What could be done is to go directly via Javascript and disable the click event of the button. In some very rare cases, Javascript confuses the click action of a button that has images as "icons" ...

Here is the code that disables: 

elemento.addEventListener('click', function(event){
    event.preventDefault();
});
    
16.11.2016 / 18:54
Instantiation of objects in php Border radius does not work inside a CSS class