integration with Fancybox

[timrate]

I seem to have found an issue when integrating with fancy box:

I'm attempting to use fancybox to pop up windows to edit child objects from a table:

`

                    <th>Select</th>
                    <th>Edit Applied Rule/Exception</th>
                    <th>Rule</th>
                    <th>Exception</th>
                    <th>Test</th>
                    <th>Type</th>

                </tr>
            </thead>

            <tbody dnd-list="dialingCategorySequences" class="dialingCatrgory">
                <tr ng-repeat="sequence in dialingCategorySequences" dnd-draggable="sequence" dnd-moved="dialingCategorySequences.splice($index,1)"
                    dnd-effect-allowed="move" dnd-selected="models.selected = sequence" ng-class="{'selected':models.selected === sequence }">
                    <td>
                        <input type="checkbox" id="checkbox_{{sequence.dialingCatSequence}}" value="{{DC.id}}/{{sequence.dialingCatSequence}}" />
                        <label for="checkbox_{{sequence.dialingCatSequence}}"></label> </td>
                    <td><a data-fancybox data-type="iframe" ng-href="DialingCategorySequenceEdit.html?dialingCategoryID={{sequence.fkDialingCatId}}&sequenceID={{sequence.dialingCatSequence}}"
                            href="javascript:;">Edit</a></td>
                    <td><a data-fancybox data-type="iframe" ng-href="../Rules/RulesEdit.html?RuleNumber={{sequence.fkRulesId}}"
                            href="javascript:;" >{{sequence.RuleName}}</a></td>
                    <td><a data-fancybox data-type="iframe" ng-href="../Exceptions/ExceptionsEdit.html?ExceptionNumber={{sequence.fkExceptionsId}}"
                            href="javascript:;">{{sequence.ExceptionName}}</a></td>
                    <td><a data-fancybox data-type="iframe" ng-href="../Timezone/TimezoneEdit.html?id=1"
                        href="javascript:;" data-type="iframe">blahblah</a></td>
                            <!--<td><a href="DialingCategorySequenceEdit.html?dialingCategoryID={{sequence.fkDialingCatId}}&sequenceID={{sequence.dialingCatSequence}}">{{ sequence.dialingCatSequence | number }}</a></td>-->
                    <td>{{ sequence.type }}</td>
                </tr>
            </tbody>`

The links all work but just redirect the browser to the page vs opening it in an iframe as intended. If I remove the angular-drag-and-drop-lists code like so: `

                    <th>Select</th>
                    <th>Edit Applied Rule/Exception</th>
                    <th>Rule</th>
                    <th>Exception</th>
                    <th>Test</th>
                    <th>Type</th>

                </tr>
            </thead>

            <tbody dnd-list="dialingCategorySequences" class="dialingCatrgory">
                <tr>
                    <td>
                        <input type="checkbox" id="checkbox_{{sequence.dialingCatSequence}}" value="{{DC.id}}/{{sequence.dialingCatSequence}}" />
                        <label for="checkbox_{{sequence.dialingCatSequence}}"></label> </td>
                    <td><a data-fancybox data-type="iframe" ng-href="DialingCategorySequenceEdit.html?dialingCategoryID={{sequence.fkDialingCatId}}&sequenceID={{sequence.dialingCatSequence}}"
                            href="javascript:;">Edit</a></td>
                    <td><a data-fancybox data-type="iframe" ng-href="../Rules/RulesEdit.html?RuleNumber={{sequence.fkRulesId}}"
                            href="javascript:;" >{{sequence.RuleName}}</a></td>
                    <td><a data-fancybox data-type="iframe" ng-href="../Exceptions/ExceptionsEdit.html?ExceptionNumber={{sequence.fkExceptionsId}}"
                            href="javascript:;">{{sequence.ExceptionName}}</a></td>
                    <td><a data-fancybox data-type="iframe" ng-href="../Timezone/TimezoneEdit.html?id=1"
                        href="javascript:;" data-type="iframe">blahblah</a></td>
                            <!--<td><a href="DialingCategorySequenceEdit.html?dialingCategoryID={{sequence.fkDialingCatId}}&sequenceID={{sequence.dialingCatSequence}}">{{ sequence.dialingCatSequence | number }}</a></td>-->
                    <td>{{ sequence.type }}</td>
                </tr>
            </tbody>`

Fancy box works. Is there any way I can work around this issue? I'm not getting any errors in the console, and I'm using fancybox with angular elsewhere so I know thats not the issue. Any help is appreciated.