我想做拖放。我从Jquery Link得到了这个想法。如何使用Jquery执行拖放操作?
我的代码也工作正常,如果我应用相同的代码而不改变任何东西。现在我想更改UI标签的ID名称。一旦我改变了,拖放不起作用。
这里是我的代码
.aspx的代码
$(function() {
$("#ColumnNamesSortable, #sortable2").sortable({
connectWith: ".connectedSortable"
}).disableSelection();
});
#ColumnNamesSortable,
#sortable2 {
border: 1px solid #846868;
min-height: 20px;
list-style-type: none;
margin: 0;
padding: 5px 0 0 0;
float: left;
margin-right: 10px;
}
#ColumnNamesSortable li,
#sortable2 li {
margin: 0 5px 5px 5px;
padding: 5px!important;
font-size: 0.9em;
width: 155px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<ul id="ColumnNamesSortable" class="connectedSortable"> //change id name from sortable1 to ColumnNamesSortable (not working)
<li class="ui-state-default">StoreID</li>
<li class="ui-state-default">ItemLookupCode</li>
<li class="ui-state-default">ExtendedDescription</li>
<li class="ui-state-default">SubDescription1</li>
<li class="ui-state-default">Department</li>
<li class="ui-state-default">Category</li>
<li class="ui-state-default">SupplierCode</li>
<li class="ui-state-default">SupplierName</li>
<li class="ui-state-default">TotalQuantity</li>
<li class="ui-state-default">ExtendedPrice</li>
<li class="ui-state-default">ExtendedCost</li>
<li class="ui-state-default">Profit</li>
<li class="ui-state-default">UnitOfMeasure</li>
<li class="ui-state-default">CustomerAccountNumber</li>
<li class="ui-state-default">CustomerName</li>
</ul>
<br />
<ul id="sortable2" class="connectedSortable"> // this one is working
<li class="ui-state-highlight">Item 1</li>
<li class="ui-state-highlight">Item 2</li>
<li class="ui-state-highlight">Item 3</li>
<li class="ui-state-highlight">Item 4</li>
<li class="ui-state-highlight">Item 5</li>
</ul>
我想创建四个拖放。例如
ColumnNamesSortable
DataField
ColumnField
RowField
为什么当我改名字特定标记的Id无法使用。它不会在控制台上显示任何错误。
你想改变什么ID? – Barmar
@Barmar你不能在我的第一行代码的注释行吗? 'ColumnNamesSortable'这是一个名字 –
我将你的问题转换为可执行代码段,它似乎工作。 – Barmar