2009-10-12 4 views
0

Dojo Drag and Drop을 사용하고 있습니다. 사용자가 컨테이너 (div dojoType = 'dojo.dnd.Source')에 항목을 추가하면 사용자가 전체 페이지를 제출할 때 나중에 서버에서 처리 할 수 ​​있도록 해당 데이터를 양식으로 가져와야합니다. 그 부분이 효과가 있습니다. 다음 항목을 제거하려면 항목을 "휴지통"컨테이너로 끌어다 놓을 수 있습니다. 숨겨진 필드에서 항목을 제거하는 방법을 개념화하는 데 어려움이 있습니다. 다음 두 가지 기능을 호출하기 위해 이미 구독/이벤트 코드가 있습니다.JavaScript RemoveChild 논리/질문

removeGoalFromHiddenFields 기능을 수행하는 더 좋은 방법이 있다면 알려주실 수 있습니까? "부 주문"항목이 많이있을 수 있습니다.

나는 아래에있는 내용으로 테스트를 시작하려고하는데, 그것에 대해 약간의 의구심이 있습니다.

감사합니다,

닐 월터스

function addGoalToHiddenFields(goalText){ 
     var field = document.createElement("input"); 
     field.setAttribute("type","hidden"); 
     field.setAttribute("value",goalText); 
     field.setAttribute("name","subgoal"); 

     //add new hidden-element to the existing form 
     document.getElementById("form1").appendChild(field); 
    } 

    function removeGoalFromHiddenFields(goalText){ 

     //remove hidden field 
     nodes = document.getElementById("form1") 
     for (i=0;i<nodes.length ;i++) 
      { 
      var pos = nodes[i].innerHTML.IndexOf(goalText) 
      if (pos > 0) 
      { 
       nodes.removeChild(node[i]); 

      } 
      } 

} 또한

, 내가 대신이 작업을 수행 할 수 있습니다 노드 = document.getElementById를 ("subgoal")를

+0

사실 removeGoal은 ... 전혀 작동하지 않을 것입니다 :

또는 오히려 DOM에 최선을 다하는 것보다 자바 스크립트에서 자신의 조회를 유지 길이 속성 (당신이 거기에 어떤 expando 마법을 가지고 있지 않다면). for-loop는 항상 중단됩니다. –

답변

2

난 여기에 원하는 것을 추측하면 dojo.query의 기능입니다. ("숨겨진", "유형")

dojo.query("#form1 input[value=\"" + goalText + "\"]").forEach(function(field) { 
    field.parentNode.removeChild(field) 
}); 
+0

고마워요. 매우 우아한 솔루션이었습니다. 필자는 필요에 따라 Dojo에 대해 더 많이 배웠고 아직 Dojo에 대한 장을 열지 않았습니다. 쿼리. 대답 - 대답 : "\"] ") – NealWalters

+0

오. 누락 된 견적을 지적 해 주셔서 감사합니다. 내 대답 고정. –

1

field.setAttribute;

같은 시도

HTML 문서에서는 setAttribute를 사용하지 마십시오. IE에는 많은 버그가 있습니다. 읽어도 쉽게 일반 DOM-HTML 속성을 사용

field.type= 'hidden'; 

var에 POS = 노드 [I] .innerHTML.IndexOf (goalText)

을 A에 대한 HTML 마크 업을 통해 검색 값이 어리석은 것이며 goalText에 '<'또는 '&'과 같은 문자가 포함되어 있으면 HTML이 이스케이프됩니다. 입력이 비어로 위의 코드의 경우

, 그것은 단지 아무것도 입력의 내용을 검색합니다 같은 경우 innerHTML이 좋지없는 당신이 추가 된 <input> 요소 중 하나이어야한다 nodes[i]처럼 보인다 요소. 대신, value 재산 보면 당신은 거기에 넣어 :

var input= nodes[i]; 
if (input.name=='subgoal' && input.value==goalText) 
    input.parentNode.removeChild(input); 
또한

, 내가 할 수있는이 대신 : 노드 = document.getElementById를 ("subgoal")

아니, 당신 subgoal 요소로 신분증이 없어.어느 이름으로 얻을 :

는 또는 DOM-0 :

var subgoals= form.elements.subgoal; 

과 동일

var subgoals= form.getElementsByName('subgoal'); 

은 (도와 각 subgoal에 ID를 추가하면 나중에 검색 :

field.id= 'id-'+goalText; 

goalText에 특수 문자를 사용할 수있는 경우 위의 내용이 다시 적용되지 않습니다. document.getElementById를 호출의 반환 형식이 없습니다 적이 있기 때문에,

var subgoalfields= {}; 
... 
// on add 
subgoalfields[goalText]= field; 
... 
// on remove 
subgoalfields[goalText].parentNode.removeChild(subgoalfields[goalText]); 
delete subgoalfields[goalText]; 
+0

IE의 setAttribute에 대한 경고 주셔서 감사합니다. 나는 내 질문을 Dojo로 제한하지 않는다는 것을 알고있다 - 그러나 dojo를 사용하는 Rakesh 대답은 훌륭하게 작동했다. – NealWalters