데이터베이스에서 생성 된 muliple 필드를 편집 가능하게 만드는 방법은 무엇입니까?

Question

약 100 개의 레코드가있는 데이터베이스가 있는데,이 레코드는 편집해야하는 웹 사이트에 표시됩니다.

생성 된 결과는 순간 다음과 같습니다 : 당신이 나 지금 짐작하지 않을 수도 있습니다 이러한 (이 문제에 그러나 의미도 없습니다) minecarft 권한입니다

<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" data-type="text" data-pk="1" data-url="test.php" data-title="Enter permission">bukkit.command.help</a></div> 
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" data-type="text" data-pk="2" data-url="test.php" data-title="Enter permission">essentials.afk</a></div> 
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" data-type="text" data-pk="3" data-url="test.php" data-title="Enter permission">essentials.list</a></div> 
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" data-type="text" data-pk="4" data-url="test.php" data-title="Enter permission">essentials.sethome.bed</a></div> 
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" data-type="text" data-pk="5" data-url="test.php" data-title="Enter permission">essentials.tpaccept</a></div> 
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" data-type="text" data-pk="6" data-url="test.php" data-title="Enter permission">itemcase.buy</a></div> 

.

이들을 편집하려면 X 편집 가능하지만 모두 동일한 ID를 가지고 있으므로 편집 할 수 없습니다 (첫 번째 레코드 제외).

데이터 -pk 요소와 마찬가지로 고유 한 ID를 갖도록 세대를 변경할 수 있습니다. 그러나 이것은 자바 스크립트 파일에서 문제를 일으킬 것입니다. 왜냐하면 저는 각 요소에 대해 자바 스크립트를 새로 추가해야하기 때문입니다.

$.fn.editable.defaults.mode = 'inline'; 
$('#permission').editable(); 

그러나이 전에 언급 한 바와 같이 첫 번째 결과를 작동합니다

현재 내 자바 스크립트는 다음과 같이한다. 나는 편집 가능한 각 요소를 정적으로 정의 할 수 있지만 데이터 양이 사전에 알려지지 않았고 동적이기 때문에 불가능합니다.

편집 가능한 필드를 어떻게 만들 수 있습니까?

Answer 1

나는 당신의 구조
마침내

$('#permissions a').editable(); 

당신이 자바 스크립트 코드

는이 라인에 자바 스크립트를 변경 변경 <div class="row"> <div class="row" id="permissions">에
변화에 고유 한 ID를 각 요소 줘

<div class="row"> 
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" ....> 
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#" id="permission" ....> 
</div> 

생각 코드는 #permissions 요소 내의 모든 요소를 ​​<a> 개 잡습니다. 자세한 내용은 this을 참조하십시오.

Answer 2

다음과 같은 상위 요소에서 콘텐츠를 감쌀 수 있습니다.

<div id="parent"> 
    <div class="col-md-4 col-sm-6 col-xs-12"> 
     <a href="#" id="permission" data-type="text" data-pk="1" data-url="test.php" data-title="Enter permission">bukkit.command.help</a> 
    </div> 
    <div class="col-md-4 col-sm-6 col-xs-12"> 
     <a href="#" id="permission" data-type="text" data-pk="2" data-url="test.php" data-title="Enter permission">essentials.afk</a> 
    </div> 
    <div class="col-md-4 col-sm-6 col-xs-12"> 
     <a href="#" id="permission" data-type="text" data-pk="3" data-url="test.php" data-title="Enter permission">essentials.list</a> 
    </div> 
    <div class="col-md-4 col-sm-6 col-xs-12"> 
     <a href="#" id="permission" data-type="text" data-pk="4" data-url="test.php" data-title="Enter permission">essentials.sethome.bed</a> 
    </div> 
    <div class="col-md-4 col-sm-6 col-xs-12"> 
     <a href="#" id="permission" data-type="text" data-pk="5" data-url="test.php" data-title="Enter permission">essentials.tpaccept</a> 
    </div> 
    <div class="col-md-4 col-sm-6 col-xs-12"> 
     <a href="#" id="permission" data-type="text" data-pk="6" data-url="test.php" data-title="Enter permission">itemcase.buy</a> 
    </div> 
</div> 

아래 선택기를 사용하여 하이퍼 링크를 반복하고 X 편집 가능한 기능을 개별적으로 호출하십시오.

Answer 3

제안을 주셔서 감사 드리며, 그들은 저에게 ID를 클래스로 변경하고 '허가'대신 '허가'를 선택할 수 있음을 깨닫게했습니다.