Question

我有一个带有数据表的表。当您单击一行时，它将打开一个模式来编辑该行。在模型中，有一个带有选色器的区域。（col2）

我遇到的问题是，颜色选择器仅在单击表的第一行时有效。

我认为解决方案是拥有一个可变的字段名，但不知道如何实现。

这里是我单击表中一行时打开的模态代码：

            echo "<div class='modal fade' id='ModalEdit".$locations['id']."' tabindex='-1' role='dialog' aria-labelledby='myModalLabel'>";
                    echo "<div class='modal-dialog' role='document'>";
                        echo "<div class='modal-content'>";
                            echo "<form class='form-horizontal' method='POST' action='editLocation.php'>";      
                            echo "<div class='modal-header'>";
                                echo"<h4 class='modal-title' id='myModalLabel' >Locatie bewerken</h4>";
                            echo "</div>";

                            echo "<div class='modal-body'>  ";      

                                echo "<div class='form-group'>  ";       
                                    echo "<label for='titel' class='col-sm-2 control-label'>Locatie</label>";                   
                                    echo "<input type='text' name='locatie' class='form-control' id='locatie' value='".$locations['locatie']."' >";                   
                                echo "</div>";

                                echo "<div class='form-group'>";
                                    echo "<label for='detailtitel' class='col-sm-2 control-label'>Color</label>";                             
                                    echo "<input type='col2' class='form-control' id = 'col2' name='col2' value='".$locations['color']."' >";   
                                echo "</div>";

                                echo"<div class='form-group'>";                             
                                    echo"<input type='hidden' name='id' class='form-control' id='id' value='".$locations['id']."'>";
                                echo" </div>";          

                            echo"</div>";             
                            echo"<div class='modal-footer'>";
                                echo"<button type='button' class='btn btn-default' data-dismiss='modal'>Close</button>";
                                echo"<button type='submit' class='btn btn-primary'>Save changes</button>";
                            echo" </div>";
                            echo"</form>";
                        echo"</div>";                   
                    echo"</div>";               
                echo"</div>";

和加载颜色选择器的脚本：

    $(function () {
        $('#col2').colorpicker({

        format: 'hex'
            });
             });

Answer 1

将ID更改为Class

ID是Unique

echo "<input type='col2' class='form-control colorpicker' id = '' name='col2' value='".$locations['color']."' >";

$(function () {
        $('.colorpicker').colorpicker({

        format: 'hex'
            });
             });

或

在引导程序function上调用选色器show modal event

引导程序模式中的引导程序颜色选择器仅适用于表的第一行

1 个答案: