Rhyzz / repeatable-fields

Repeatable Fields

Home Page:http://www.rhyzz.com/repeatable-fields.html

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How can i add repeating js to each repeated group

gracecompany opened this issue · comments

This is the repeating part.

<div class="repeat">
    <div class="col-lg-12">
        <div class="panel panel-default wrapper">
            <div class="panel-heading"><span class="glyphicon glyphicon-warning-sign"></span> Alerts Section</div>


            <div class="panel-body alert-container row">
			<p><span class="btn btn-primary add"><span class="glyphicon glyphicon-plus"></span>&nbsp; Add</span></p>

			<div class="col-md-6 template ">
                <table class="table table-condensed" width="100%" style="border-collapse:collapse;">

                    <tbody id="multi">
                        <tr data-toggle="collapse" data-target="#alert({row-count-placeholder})" class="accordion-toggle template row bg-primary">
                            <td style="max-width:5%"> <span class="btn btn-default btn-xs"><span class="glyphicon glyphicon-eye-open"></span></span> </td>
                            <td style="min-width:90%">
                            <input id="alert_title" class="form-control" name="alerts[alert_title][({row-count-placeholder})]" type="text" placeholder="  Alert Title" style="min-width:100%" /></td>
                            <td style="max-width:5%"> <span class="btn btn-default btn-xs"><span class="remove glyphicon glyphicon-remove"></span></span>  </td>
                        </tr>
                        <tr>
                            <td colspan="12" class="hiddenRow">
                                <div class="accordian-body collapse" id="alert({row-count-placeholder})">
                                    <table class="table table-striped">
                                        <thead>
                                            <tr>
                                                <th>LAYOUT</th>
                                                <th>TYPE</th>
                                                <th>ICON</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>
                                                    <select id="alertstyle" name="alerts[alertstyle][({row-count-placeholder})]" class="form-control" autofocus>
                                                        <option value="" class="">-- layout --</option>
                                                        <option value="style-msg">Message Box</option>
                                
                                                    </select>
                                                </td>
                                                <td>
                                                    <select id="alerttype" name="alerts[alerttype][({row-count-placeholder})]" class="form-control" autofocus>
                                                        <option value="" class="">-- type --</option>
                                                        <option value="successmsg" class="style-msg">Success Message</option>

                                                    </select>
                                                </td>
                                                <td>
                                                    <select id="alerticon" name="alerts[alerticon][({row-count-placeholder})]" class="form-control" autofocus>
                                                        <option value="" class="">-- icon --</option>
                                                        <option value="fa-exclamation" class="alertmsg alert-warning alert-success successmsg">fa-exclamation</option>
                                                   
                                                    </select>
                                                </td>
                                            </tr>
                                            <tr>
                                                <textarea id="alert_message" name="alerts[alert_message][({row-count-placeholder})]" rows="5"  style="min-width: 100%" placeholder="&nbsp; Alert Message"></textarea>
                                            </tr>
                                        </tbody>
                                        select

                                    </table>

                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>

                </div>
            </div>
        </div>
    </div>
</div>

trying to get the following code to work with each new repeated block

            $("select#alerttype").chained("select#alertstyle");
            $("select#alerticon").chained("select#alerttype, select#alertstyle");

Multiple id => broke HTML and jquery, never use multiple id.