This topic contains 5 replies, has 2 voices, and was last updated by  Anonymous 3 years, 5 months ago.

Several Issues with input Radio


  • sandroriz
    Participant

    Posts: 5
    Member Reply #1635

    I found several issues (admin theme 1 , v4.0) with simple radio button.
    Basically it works only when the label is sourrinding the input tag and when it hasn’t the FOR clause.
    In any other situation the radio is not clickable (or is clickable not on input but on label or far from control).

    The problem is that asp.net radiobuttonlist control renders the label after the input, so it is impossibile to create a simple form with radio

    Plus, a esthaetic issue, inside a form-horizontal div, the label in mis-aligned (7px above input).

    I took your layout_blank page and put some sample inside. See please
    http://www.microgate.org/metronics/testradio.html

    The problem seem to reside in jquery.uniform.min.js, but it is impossibile to remove without creating other layout problems.

    Thanks in advance

     

     

     

     

    • This topic was modified 3 years, 5 months ago by  sandroriz.

    Anonymous
    Support Staff Reply #1642

    Dear Sandroriz,

    Thank you for your feedback. Please note that this is not the bug of the theme. It seems that the bug comes from the code, where you create a new page according to your project requirements. 🙂

    We have found the radio button space causes the issue. Kindly add the following code to custom.css or your theme CSS file.

    .checkbox input[type=checkbox],

    .checkbox-inline input[type=checkbox],

    .radio input[type=radio],

    .radio-inline input[type=radio] {

    margin-left: -9px;

    /*margin-left: -20px;*/ default code

    }

    Please do not hesitate to ask questions or report a proper issue question about the theme. Our theme support will be glad to help.

    Please do not forget to mark your topic as resolved when it’s fixed so we know not to come looking there anymore.

    Thanks


    sandroriz
    Participant

    Posts: 5
    Member Reply #1663

    Zis,

    thank you very much for your quick reply. I agree it is not a bug (indeed on your form sample page it works), but unfortunately in many frameworks or CMS you don’t have the full control how some things are rendered.

    I applied your fix and it works “better” but not perfectly 100%; in IE11 to be sure to change the checked status of the radio I have to click on the left side of its circle; if I click right or in the center, still doesn’ work; I will try to tweak that -9px… (or advice to use Chrome 🙂 )

    Any suggestion for the label higher than input if I use form-horizontal ? The responsable seems to be padding-top:7px on bootstrap.css

    Thanks again

    Sandro


    Anonymous
    Support Staff Reply #1665

    Hi,

    We have checked the code and it works fine in IE9-11 respectively. But I’d advice you to update the above mentioned code to the following

    .checkbox input[type=checkbox],

    .checkbox-inline input[type=checkbox],

    .radio input[type=radio],

    .radio-inline input[type=radio] {

    margin-left: -9px;

    position: relative;

    z-index: 1;

    }

    Form-horizontal issue can be fixed by correcting some codes in CSS file. Kindly add the following code in your CSS file.

    .form-horizontal .checkbox,

    .form-horizontal .checkbox-inline,

    .form-horizontal .radio,

    .form-horizontal .radio-inline {

    padding-top: 0;

    }

    label {

    position: relative;

    top: 1px;

    }

    If you need any further clarifications please let us know.

    Cheers! 😉


    sandroriz
    Participant

    Posts: 5
    Member Reply #1667

    Zis,

    this work perfectly… but WHY you spend 5 seconds, and me 2 days to try to fix ??? Grrrr :-))

    Thanks very much, your support for a 27$ product is much better than those of 2700$ !!

    Sandro


    Anonymous
    Support Staff Reply #1668

    Dear Sandroiz,

    Thank you for your feedback. We really appreciate it. Your feedback and comments will help us to improve Meetronic. Do not hesitate to ask questions about the theme. Our theme support will be glad to help.

    Please do not forget to mark your topic as resolved when it’s fixed so we know not to come looking there anymore.

    Stay tuned for more amazing features, and, please, give us a follow on http://twitter.com/keenthemes

    Kindest Regards 😉

    Keenthemes

Tagged: 

You must be logged in to reply to this topic.