Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

initializing radio buttons added dynamically in materialize

I have an ajax request that generates a modal window with radio buttons dynamically.

I see in the materialize documentation that you can execute material_select() to get selects working correctly however, I don't see in the documentation how to initialize a radio dynamically.

How do i initialize dynamically loaded radio buttons?

For reference here is in example modal that I am loading dynamically:

<div id="import-modal" class="modal modal-fixed-footer">
    <div class="modal-content">
        <h4>Import Data</h4>
        <p>
            <input name="import-group" type="radio" id="import-modal-csv"/>
            <label for="import-modal-csv">Csv</label>
            <div>Import a csv file.</div>
        <p/>
        <p>
            <input name="import-group" type="radio" id="import-modal-excel"/>
            <label for="import-modal-excel">Excel</label>
            <div>Import a excel file.</div>
        </p>
    </div>
    <div class="modal-footer">
        <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">Import</a>
    </div>
</div>

edit 1

i'm adding the above div dynamically via jquery to a parent container on click of a button:

        import_click: function(){
            $.ajax({
                url: 'template/import.html',
                success: function (response) {
                    $('#container').append(response);
                }
            });
        }
like image 257
weeksdev Avatar asked Jul 22 '15 02:07

weeksdev


1 Answers

The radio buttons do not require any javascript initialization. Just make sure when you append them dynamically to give them new ID's because if they conflict with existing radio buttons, they will not work.

like image 144
Acburst Avatar answered Nov 03 '22 22:11

Acburst